2017-04-24 61 views
1

版本renderer.js:2.3.3的WebPackERROR從UglifyJs意外標記PUNC«(»

您好

我試圖用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 [email protected] 
3 info using [email protected] 
4 verbose run-script [ 'prepack', 'pack', 'postpack' ] 
5 info lifecycle [email protected]~prepack: [email protected] 
6 silly lifecycle [email protected]~prepack: no script for prepack, continuing 
7 info lifecycle [email protected]~pack: [email protected] 
8 verbose lifecycle [email protected]~pack: unsafe-perm in lifecycle true 
9 verbose lifecycle [email protected]~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 [email protected]~pack: CWD: /Users/admin/Code/electron/formbuff 
11 silly lifecycle [email protected]~pack: Args: [ '-c', 'npm run pack:main && npm run pack:renderer' ] 
12 silly lifecycle [email protected]~pack: Returned: code: 2 signal: null 
13 info lifecycle [email protected]~pack: Failed to exec pack script 
14 verbose stack Error: [email protected] 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 [email protected] 
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 [email protected] pack: `npm run pack:main && npm run pack:renderer` 
23 error Exit status 2 
24 error Failed at the [email protected] 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 ] 
+0

爲什麼在一個電子應用程序的webpack?您可以使用電子編譯並自動構建所有單個文件組件(如果您正在使用它們)。 https://github.com/electron/electron-compile – Bert

+0

@BertEvans老實說,我搜索了一些電子和vuejs的樣板,並發現了這個 - https://simulatedgreg.gitbooks.io/electron-vue/en/ I'我用它構建了一些其他的東西(雖然小應用程序),我沒有問題。我會看看你的鏈接,看起來不錯!謝謝! – bencarter78

回答

0

你可以嘗試安裝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"] 
} 

希望它有幫助:)