2017-08-24 78 views
2

我使用webpack捆绑模块反应写在ES6中。直到我添加了json-immutable插件之前,所有工作都已经完成。目前需要的是json-stream-stringify,有一类:webpack 2 uglify插件ES6

class JSONStreamify extends CoStream {...} 
module.exports = function(obj, replacer) { 
    return new JSONStreamify(obj, replacer); 
}; 

的WebPack的作品不错,但因为丑化掷错误

Unexpected token: name (JSONStreamify)

我发现这里有关模块https://github.com/webpack-contrib/uglifyjs-webpack-plugin信息不monify文件。我安装并添加了ecma支持,但仍然存在相同的错误。我已删除我尝试添加排除node_modules但没有结果。

我webpack.config.js是

const path = require('path'); 
const webpack = require('webpack'); 
const UglifyJSPlugin = require('uglifyjs-webpack-plugin'); 
module.exports = { 
    entry: { 
    backend: './src/backend.js', 
    frontend: './src/frontend.js', 
    }, 
    output: { 
    path: path.resolve(__dirname,'./dist'), 
    filename: '[name].sakui.min.js' 
    }, 
    externals: { 
    'jQuery':'jQuery', 
    'Foundation':'Foundation', 
    'react': 'React', 
    'react-dom': 'ReactDOM', 
    'redux': 'Redux', 
    'react-redux': 'ReactRedux', 
    'immutable': 'Immutable', 
    'lodash': '_', 
    '_': '_' 
    }, 
    module: { 
    rules: [ 
     { 
     test: /\.js$/, 
     exclude: /node_modules/, 
     use: { 
      loader: 'babel-loader', 
      options: { 
      "only": "src/**", 
      "presets": [ 
       "env", 
       "react", 
       "es2017", 
       "stage-3" 
      ], 
      "plugins": [["transform-class-properties", { "spec": true }],"transform-decorators-legacy","minify-simplify"], 
      "babelrc": false 
      } 
     } 
     } 
    ] 
    }, 
    plugins: [ 
    new UglifyJSPlugin({ 
     ecma: 6 
    }) 
    ] 
} 

任何提示我怎么能解决这个问题?也许任何外部工具来缩小文件后的文件?

+1

Uglify不太了解ES6,..你有2个选项,转换成ES5和Uglify,或者不使用Uglify并使用Babel自己的Uglifyer。 (Babili) – Keith

+0

我可以添加webpack选项以仅将ES_5转储到node_modules吗? (将检查babili看起来不错) – jaroApp

+0

顺便说一句我从我的webpack文件中删除uglify插件,但我仍然有这个错误。 我应该清除一些缓存吗?我看到它使用了什么正确的webpack.config文件 – jaroApp

回答

0

解决方案:

一个办法我发现了什么是transpile所有与巴贝尔node_modules到ES5和它的作品。

我webpack.config.js

const path = require('path'); 
const webpack = require('webpack'); 
const UglifyJSPlugin = require('uglifyjs-webpack-plugin'); 
module.exports = { 
    entry: { 
    backend: './src/backend.js', 
    frontend: './src/frontend.js', 
    }, 
    output: { 
    path: path.resolve(__dirname,'./dist'), 
    filename: '[name].sakui.min.js' 
    }, 
    externals: { 
    'jQuery':'jQuery', 
    'Foundation':'Foundation', 
    'react': 'React', 
    'react-dom': 'ReactDOM', 
    'redux': 'Redux', 
    'react-redux': 'ReactRedux', 
    'immutable': 'Immutable', 
    'lodash': '_', 
    '_': '_' 
    }, 
    module: { 
    rules: [ 
     { 
     test: /\.js$/, 
     use: { 
      loader: 'babel-loader', 
      options: { 
      "presets": [ 
       "env", 
       "react", 
       "es2017", 
       "stage-3" 
      ], 
      "plugins": [["transform-class-properties", { "spec": true }],"transform-decorators-legacy"], 
      "babelrc": false 
      } 
     } 
     } 
    ] 
    }, 
    plugins: [ 
    new UglifyJSPlugin() 
    ] 
} 

也许将是有用的人。