ERROR从UglifyJs意外标记PUNC«（»

Question

版本renderer.js：2.3.3的WebPack

您好

我试图用Vuejs打造我的第一个电子的应用程序的一切，似乎是想伟大的，直到我来打包应用程序。

当我运行npm run dev一切工作就好了。

然而，当我运行npm build:darwin我收到以下错误

ERROR in renderer.js from UglifyJs Unexpected token punc «(», expected punc «:» [renderer.js:26813,14]

它确实最终编译，但是当我运行应用程序时，我得到了死亡的白色屏幕。

从我读，这可能是因为Uglifyjs不编译器ES6，但你可以通过在.babelrc文件

"renderer": { 
    "presets": [ 
    ["es2015", { "modules": false }], 
    "stage-0" 
    ] 
} 

以下我不知道如何调试这克服。任何帮助将不胜感激。

感谢

所生成的是...的debug.log

0 info it worked if it ends with ok 
1 verbose cli [ '/usr/local/Cellar/node/7.9.0/bin/node', 
1 verbose cli '/usr/local/bin/npm', 
1 verbose cli 'run', 
1 verbose cli 'pack' ] 
2 info using npm@4.2.0 
3 info using node@v7.9.0 
4 verbose run-script [ 'prepack', 'pack', 'postpack' ] 
5 info lifecycle FormBuff@0.0.0~prepack: FormBuff@0.0.0 
6 silly lifecycle FormBuff@0.0.0~prepack: no script for prepack, continuing 
7 info lifecycle FormBuff@0.0.0~pack: FormBuff@0.0.0 
8 verbose lifecycle FormBuff@0.0.0~pack: unsafe-perm in lifecycle true 
9 verbose lifecycle FormBuff@0.0.0~pack: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bin:/Users/admin/Code/electron/formbuff/node_modules/.bin:/Users/admin/Code/electron/formbuff/node_modules/.bin:/Users/admin/.config/yarn/link/node_modules/.bin:/Users/admin/Code/electron/formbuff/node_modules/.bin:/Users/admin/.config/yarn/link/ node_modules/.bin:/usr/local/Cellar/yarn/0.23.2/libexec/bin/node-gyp-bin:/Users/admin/.rbenv/shims:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Users/admin/.composer/vendor/bin:/Users/admin/go/bin 
10 verbose lifecycle FormBuff@0.0.0~pack: CWD: /Users/admin/Code/electron/formbuff 
11 silly lifecycle FormBuff@0.0.0~pack: Args: [ '-c', 'npm run pack:main && npm run pack:renderer' ] 
12 silly lifecycle FormBuff@0.0.0~pack: Returned: code: 2 signal: null 
13 info lifecycle FormBuff@0.0.0~pack: Failed to exec pack script 
14 verbose stack Error: FormBuff@0.0.0 pack: `npm run pack:main && npm run pack:renderer` 
14 verbose stack Exit status 2 
14 verbose stack  at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/lib/utils/lifecycle.js:279:16) 
14 verbose stack  at emitTwo (events.js:106:13) 
14 verbose stack  at EventEmitter.emit (events.js:194:7) 
14 verbose stack  at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/lib/utils/spawn.js:40:14) 
14 verbose stack  at emitTwo (events.js:106:13) 
14 verbose stack  at ChildProcess.emit (events.js:194:7) 
14 verbose stack  at maybeClose (internal/child_process.js:899:16) 
14 verbose stack  at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5) 
15 verbose pkgid FormBuff@0.0.0 
16 verbose cwd /Users/admin/Code/electron/formbuff 
17 error Darwin 16.5.0 
18 error argv "/usr/local/Cellar/node/7.9.0/bin/node" "/usr/local/bin/npm" "run" "pack" 
19 error node v7.9.0 
20 error npm v4.2.0 
21 error code ELIFECYCLE 
22 error errno 2 
23 error FormBuff@0.0.0 pack: `npm run pack:main && npm run pack:renderer` 
23 error Exit status 2 
24 error Failed at the FormBuff@0.0.0 pack script 'npm run pack:main && npm run pack:renderer'. 
24 error Make sure you have the latest version of node.js and npm installed. 
24 error If you do, this is most likely a problem with the FormBuff package, 
24 error not with npm itself. 
24 error Tell the author that this fails on your system: 
24 error  npm run pack:main && npm run pack:renderer 
24 error You can get information on how to open an issue for this project with: 
24 error  npm bugs FormBuff 
24 error Or if that isn't available, you can get their info via: 
24 error  npm owner ls FormBuff 
24 error There is likely additional logging output above. 
25 verbose exit [ 2, true ] 

Answer 1

我类似的问题作斗争。这是招 https://github.com/SimulatedGREG/electron-vue/issues/200

Answer 2

你可以尝试安装this版本的uglify，它呼吁uglify-es，它是：

JavaScript分析器，压榨机/压缩机和美化工具包ES6 +

uglify-es npm link

在我的情况下，我已经安装babel插件来处理这个问题。 如果您想尝试，你应该这样做：

添加到您的package.json

"babel-core": "latest", 
"babel-loader": "latest", 
"babel-plugin-transform-async-to-generator": "latest", 
"babel-plugin-transform-runtime": "latest", 
"babel-preset-es2015": "latest", 
"babel-runtime": "latest" 

设置你webpack.config文件是像（这是我的为例）：

const path = require('path') 
const webpack = require('webpack') 

module.exports = { 
    entry: './src/main.js', 
    output: { 
     path: path.resolve(__dirname, './dist'), 
     publicPath: '/dist/', 
     filename: 'build.js' 
    }, 
    module: { 
     rules: [ 
      { 
       test: /\.vue$/, 
       loader: 'vue-loader' 
      }, 
      { 
       test: /\.js$/, 
       loader: 'babel-loader', 
       exclude: /node_modules/ 
      }, 
      { 
       test: /\.(png|jpg|gif|svg)$/, 
       loader: 'file-loader', 
       query: { 
        name: '[name].[ext]?[hash]' 
       } 
      }, 
      { 
       test: /\.scss$/, 
       use: ['style-loader', 'css-loader', 'sass-loader'] 
      } 
     ] 
    } 
} 

if (process.env.NODE_ENV === 'production') { 
    module.exports.devtool = '#source-map' 
    module.exports.plugins = (module.exports.plugins || []).concat([ 
     new webpack.optimize.UglifyJsPlugin({ sourceMap: true, compress: { warnings: false }}) 
    ]) 
} 

套装您的.babelrc文件应如下所示：

{ 
    "presets": ["es2015"], 
    "plugins": ["transform-runtime", "transform-async-to-generator"] 
} 

希望它有帮助:)