SyntaxError: Unexpected token: string (expose?Tether!tether) on npm run build
SyntaxError: Unexpected token: string (expose?Tether!tether) on npm run build
您好,当 运行ning npm 运行 构建在我的 prestashop 主题上时出现错误,我不知道它来自哪里。
错误如下:
SyntaxError: Unexpected token: string (expose?Tether!tether) [./js/theme.js:25,7]
我的 webpack.config.js 看起来像这样:
var webpack = require('webpack');
var path = require('path');
var ExtractTextPlugin = require("extract-text-webpack-plugin");
var plugins = [];
var production = true;
if (production) {
plugins.push(
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
})
);
}
plugins.push(
new ExtractTextPlugin(
path.join(
'..', 'css', 'theme.css'
)
)
);
module.exports = {
entry: [
'./js/theme.js'
],
output: {
path: '../assets/js',
filename: 'theme.js'
},
module: {
loaders: [{
test: /\.js$/,
exclude: /node_modules/,
loaders: ['babel-loader']
}, {
test: /\.scss$/,
loader: ExtractTextPlugin.extract(
"style",
"css?sourceMap!postcss!sass?sourceMap"
)
}, {
test: /.(png|woff(2)?|eot|ttf|svg)(\?[a-z0-9=\.]+)?$/,
loader: 'file-loader?name=../css/[hash].[ext]'
}, {
test: /\.css$/,
loader: "style-loader!css-loader!postcss-loader"
}]
},
postcss: function() {
return [require('postcss-flexibility')];
},
externals: {
prestashop: 'prestashop',
$: '$',
jquery: 'jQuery'
},
devtool: 'source-map',
plugins: plugins,
resolve: {
extensions: ['', '.js', '.scss']
}
};
而抛出错误的文件是 theme.js
import 'expose/Tether/tether';
import 'bootstrap/dist/js/bootstrap.min';
import 'flexibility';
import 'bootstrap-touchspin';
import '../css/theme';
import './responsive';
import './checkout';
import './customer';
import './listing';
import './product';
import './cart';
import DropDown from './components/drop-down';
import Form from './components/form';
import ProductMinitature from './components/product-miniature';
import ProductSelect from './components/product-select';
import TopMenu from './components/top-menu';
import prestashop from 'prestashop';
import EventEmitter from 'events';
import './lib/bootstrap-filestyle.min';
import './lib/jquery.scrollbox.min';
import './components/block-cart';
// "inherit" EventEmitter
for (var i in EventEmitter.prototype) {
prestashop[i] = EventEmitter.prototype[i];
}
$(document).ready(() => {
let dropDownEl = $('.js-dropdown');
const form = new Form();
let topMenuEl = $('.js-top-menu ul[data-depth="0"]');
let dropDown = new DropDown(dropDownEl);
let topMenu = new TopMenu(topMenuEl);
let productMinitature = new ProductMinitature();
let productSelect = new ProductSelect();
dropDown.init();
form.init();
topMenu.init();
productMinitature.init();
productSelect.init();
});
Webpack 真的不是我的强项,我找遍了但找不到与此错误相关的任何内容。
如有任何帮助,我们将不胜感激。
同事最后帮我搞定了。
我需要将正确的预设添加到 babel-loader 查询中:
loaders: [{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets: ['es2015']
}
},
我认为问题是您在执行升级后没有 运行 npm install。
您好,当 运行ning npm 运行 构建在我的 prestashop 主题上时出现错误,我不知道它来自哪里。
错误如下:
SyntaxError: Unexpected token: string (expose?Tether!tether) [./js/theme.js:25,7]
我的 webpack.config.js 看起来像这样:
var webpack = require('webpack');
var path = require('path');
var ExtractTextPlugin = require("extract-text-webpack-plugin");
var plugins = [];
var production = true;
if (production) {
plugins.push(
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
})
);
}
plugins.push(
new ExtractTextPlugin(
path.join(
'..', 'css', 'theme.css'
)
)
);
module.exports = {
entry: [
'./js/theme.js'
],
output: {
path: '../assets/js',
filename: 'theme.js'
},
module: {
loaders: [{
test: /\.js$/,
exclude: /node_modules/,
loaders: ['babel-loader']
}, {
test: /\.scss$/,
loader: ExtractTextPlugin.extract(
"style",
"css?sourceMap!postcss!sass?sourceMap"
)
}, {
test: /.(png|woff(2)?|eot|ttf|svg)(\?[a-z0-9=\.]+)?$/,
loader: 'file-loader?name=../css/[hash].[ext]'
}, {
test: /\.css$/,
loader: "style-loader!css-loader!postcss-loader"
}]
},
postcss: function() {
return [require('postcss-flexibility')];
},
externals: {
prestashop: 'prestashop',
$: '$',
jquery: 'jQuery'
},
devtool: 'source-map',
plugins: plugins,
resolve: {
extensions: ['', '.js', '.scss']
}
};
而抛出错误的文件是 theme.js
import 'expose/Tether/tether';
import 'bootstrap/dist/js/bootstrap.min';
import 'flexibility';
import 'bootstrap-touchspin';
import '../css/theme';
import './responsive';
import './checkout';
import './customer';
import './listing';
import './product';
import './cart';
import DropDown from './components/drop-down';
import Form from './components/form';
import ProductMinitature from './components/product-miniature';
import ProductSelect from './components/product-select';
import TopMenu from './components/top-menu';
import prestashop from 'prestashop';
import EventEmitter from 'events';
import './lib/bootstrap-filestyle.min';
import './lib/jquery.scrollbox.min';
import './components/block-cart';
// "inherit" EventEmitter
for (var i in EventEmitter.prototype) {
prestashop[i] = EventEmitter.prototype[i];
}
$(document).ready(() => {
let dropDownEl = $('.js-dropdown');
const form = new Form();
let topMenuEl = $('.js-top-menu ul[data-depth="0"]');
let dropDown = new DropDown(dropDownEl);
let topMenu = new TopMenu(topMenuEl);
let productMinitature = new ProductMinitature();
let productSelect = new ProductSelect();
dropDown.init();
form.init();
topMenu.init();
productMinitature.init();
productSelect.init();
});
Webpack 真的不是我的强项,我找遍了但找不到与此错误相关的任何内容。
如有任何帮助,我们将不胜感激。
同事最后帮我搞定了。 我需要将正确的预设添加到 babel-loader 查询中:
loaders: [{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets: ['es2015']
}
},
我认为问题是您在执行升级后没有 运行 npm install。