問題描述

webpack2 打包姿勢可能沒對，轉碼兼容性不是很好，下面是我的webpack.config.js配置文件(省略了一些無關緊要的):

/** * webpack本地配置 * Less 2017-6-15 2:00 */var path = require(’path’);var webpack = require(’webpack’);var ExtractTextPlugin = require('extract-text-webpack-plugin');var CompressionPlugin = require(’compression-webpack-plugin’);var HtmlWebpackPlugin = require(’html-webpack-plugin’);// var BabiliPlugin = require('babili-webpack-plugin');// 下面這幾個require也寫到了入口文件main.js最上面去了require(’es5-shim’);require(’es5-shim/es5-sham’);require(’console-polyfill’);require(’core-js/fn/object/assign’);require( 'babel-polyfill');var config = { entry: path.resolve(__dirname, ’../../react/main.js’), output: {filename: ’bundle.js’,path: path.resolve(__dirname, ’../../view’),publicPath: `${NGINX}` }, module: {rules: [{ test: /.(js|jsx)$/, loader: ’babel-loader’, exclude: /node_modules/, include: path.join(__dirname, ’../../react’), options: {presets: ['es2015', 'react', 'stage-0', 'stage-1'] }}, { test: /.css$/, loader: ExtractTextPlugin.extract({fallback: ’style-loader’,use: [ ’css-loader?modules&importLoaders=1&localIdentName=[local]--[hash:base64:5]’, {loader: ’postcss-loader’,options: { plugins: function () {return [ require(’autoprefixer’)]; }} }] })}, { test: /.(png|jpg|jpeg|gif|md)$/, use: [’file-loader?limit=10000&name=[md5:hash:base64:10].[ext]’]}, { test: /.svg(?v=d+.d+.d+)?$/, use: [’url-loader?limit=10000&mimetype=image/svg+xml’]}], }, plugins}module.exports = config;

在華為p7手機上運行，控制臺顯示：

Uncaught SyntaxError: Unexpected token . bundle.js:10541// 定位到這一段代碼：const config = { baseConfig: __webpack_require__(280)(`./${nodeEnv}/config`)}

很明顯ES6的字符串模板特性沒有轉換為ES5的語法，why?

不知道怎么轉才能轉得更好？求segmentfault大神解答，3Q~

問題解答

bablerc 中增加

{ 'plugins': [ ['transform-es2015-template-literals', { 'loose': true, 'spec': true }] ]}