搜索
搜索

npm run build在我的vue cli项目中抛出错误，但是npm run dev可以正常工作

endrick 发表于 Dev
52
恩德里克

当我运行npm run build时，会遇到很多错误，但是当我运行npm run dev时，它可以正常工作而不会出错。

我试图将webpack.config.js的公共路径更改为./dist，但这并不能解决。我也尝试安装uglifyjs，但也无济于事。我不知道还能尝试什么。

这是我的webpack.config.js文件

var path = require('path')
var webpack = require('webpack')
const VueLoaderPlugin = require('vue-loader/lib/plugin')
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
module.exports = {
  entry: './src/main.js',
  output: {
    path: path.resolve(__dirname, './dist'),
    publicPath: './dist/',
    filename: 'build.js'
  },
  plugins: [
    new VueLoaderPlugin()
  ],
  optimization: {
    minimizer: [new UglifyJsPlugin()],
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [
          'vue-style-loader',
          'css-loader'
        ],
      },      {
        test: /\.vue$/,
        loader: 'vue-loader',
        options: {
          loaders: {
          }
          // other vue-loader options go here
        }
      },
      {
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/
      },
      {
        test: /\.(png|jpg|gif|svg)$/,
        loader: 'file-loader',
        options: {
          name: '[name].[ext]?[hash]'
        }
      }
    ]
  },
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.esm.js'
    },
    extensions: ['*', '.js', '.vue', '.json']
  },
  devServer: {
    historyApiFallback: true,
    noInfo: true,
    overlay: true
  },
  performance: {
    hints: false
  },
  devtool: '#eval-source-map'
}

if (process.env.NODE_ENV === 'production') {
  module.exports.devtool = '#source-map'
  // http://vue-loader.vuejs.org/en/workflow/production.html
  module.exports.plugins = (module.exports.plugins || []).concat([
    new webpack.DefinePlugin({
      'process.env': {
        NODE_ENV: '"production"'
      }
    }),
    new webpack.optimize.UglifyJsPlugin({
      sourceMap: true,
      compress: {
        warnings: false
      }
    }),
    new webpack.LoaderOptionsPlugin({
      minimize: true
    })
  ])
}

这是我的package.json文件

{

  "scripts": {
    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --inline --hot",
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
  },
  "dependencies": {
    "vue": "^2.5.11",
    "vue-router": "^3.0.6",
    "vuex": "^3.1.0"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ],
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-loader": "^7.1.2",
    "babel-preset-env": "^1.6.0",
    "babel-preset-stage-3": "^6.24.1",
    "cross-env": "^5.0.5",
    "css-loader": "^2.1.1",
    "file-loader": "^1.1.4",
    "uglifyjs-webpack-plugin": "^2.1.3",
    "vue-loader": "^15.7.0",
    "vue-template-compiler": "^2.4.4",
    "webpack": "^4.30.0",
    "webpack-cli": "^3.3.1",
    "webpack-dev-server": "^3.3.1"
  }
}

当我运行npm run build时，它应该创建一个dist文件夹，其中包括在生产模式下运行所需的所有文件。相反，我得到这些错误


/Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/cli.js:74
                                throw err;
                                ^

Error: webpack.optimize.UglifyJsPlugin has been removed, please use config.optimization.minimize instead.
    at Object.get [as UglifyJsPlugin] (/Users/pat/Desktop/side/iread/node_modules/webpack/lib/webpack.js:185:10)
    at Object.<anonymous> (/Users/pat/Desktop/side/iread/webpack.config.js:75:26)
    at Module._compile (/Users/pat/Desktop/side/iread/node_modules/v8-compile-cache/v8-compile-cache.js:192:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:745:10)
    at Module.load (internal/modules/cjs/loader.js:626:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:566:12)
    at Function.Module._load (internal/modules/cjs/loader.js:558:3)
    at Module.require (internal/modules/cjs/loader.js:663:17)
    at require (/Users/pat/Desktop/side/iread/node_modules/v8-compile-cache/v8-compile-cache.js:161:20)
    at WEBPACK_OPTIONS (/Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/utils/convert-argv.js:115:13)
    at requireConfig (/Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/utils/convert-argv.js:117:6)
    at /Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/utils/convert-argv.js:124:17
    at Array.forEach (<anonymous>)
    at module.exports (/Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/utils/convert-argv.js:122:15)
    at yargs.parse (/Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/cli.js:71:45)
    at Object.parse (/Users/pat/Desktop/side/iread/node_modules/yargs/yargs.js:567:18)
    at /Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/cli.js:49:8
    at Object.<anonymous> (/Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/cli.js:375:3)
    at Module._compile (internal/modules/cjs/loader.js:734:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:745:10)
    at Module.load (internal/modules/cjs/loader.js:626:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:566:12)
    at Function.Module._load (internal/modules/cjs/loader.js:558:3)
    at Module.require (internal/modules/cjs/loader.js:663:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at Object.<anonymous> (/Users/pat/Desktop/side/iread/node_modules/webpack/bin/webpack.js:156:2)
    at Module._compile (internal/modules/cjs/loader.js:734:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:745:10)
    at Module.load (internal/modules/cjs/loader.js:626:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:566:12)
    at Function.Module._load (internal/modules/cjs/loader.js:558:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:797:12)
    at executeUserCode (internal/bootstrap/node.js:526:15)
    at startMainThreadExecution (internal/bootstrap/node.js:439:3)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `cross-env NODE_ENV=production webpack --progress --hide-modules`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/pat/.npm/_logs/2019-05-23T17_34_37_411Z-debug.log
Patricks-MacBook-Pro:iread pat$ npm run build

> [email protected] build /Users/pat/Desktop/side/iread
> cross-env NODE_ENV=production webpack --progress --hide-modules

/Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/cli.js:74
                                throw err;
                                ^

Error: webpack.optimize.UglifyJsPlugin has been removed, please use config.optimization.minimize instead.
    at Object.get [as UglifyJsPlugin] (/Users/pat/Desktop/side/iread/node_modules/webpack/lib/webpack.js:185:10)
    at Object.<anonymous> (/Users/pat/Desktop/side/iread/webpack.config.js:75:26)
    at Module._compile (/Users/pat/Desktop/side/iread/node_modules/v8-compile-cache/v8-compile-cache.js:192:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:745:10)
    at Module.load (internal/modules/cjs/loader.js:626:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:566:12)
    at Function.Module._load (internal/modules/cjs/loader.js:558:3)
    at Module.require (internal/modules/cjs/loader.js:663:17)
    at require (/Users/pat/Desktop/side/iread/node_modules/v8-compile-cache/v8-compile-cache.js:161:20)
    at WEBPACK_OPTIONS (/Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/utils/convert-argv.js:115:13)
    at requireConfig (/Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/utils/convert-argv.js:117:6)
    at /Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/utils/convert-argv.js:124:17
    at Array.forEach (<anonymous>)
    at module.exports (/Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/utils/convert-argv.js:122:15)
    at yargs.parse (/Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/cli.js:71:45)
    at Object.parse (/Users/pat/Desktop/side/iread/node_modules/yargs/yargs.js:567:18)
    at /Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/cli.js:49:8
    at Object.<anonymous> (/Users/pat/Desktop/side/iread/node_modules/webpack-cli/bin/cli.js:375:3)
    at Module._compile (internal/modules/cjs/loader.js:734:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:745:10)
    at Module.load (internal/modules/cjs/loader.js:626:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:566:12)
    at Function.Module._load (internal/modules/cjs/loader.js:558:3)
    at Module.require (internal/modules/cjs/loader.js:663:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at Object.<anonymous> (/Users/pat/Desktop/side/iread/node_modules/webpack/bin/webpack.js:156:2)
    at Module._compile (internal/modules/cjs/loader.js:734:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:745:10)
    at Module.load (internal/modules/cjs/loader.js:626:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:566:12)
    at Function.Module._load (internal/modules/cjs/loader.js:558:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:797:12)
    at executeUserCode (internal/bootstrap/node.js:526:15)
    at startMainThreadExecution (internal/bootstrap/node.js:439:3)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `cross-env NODE_ENV=production webpack --progress --hide-modules`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/pat/.npm/_logs/2019-05-23T17_34_58_975Z-debug.log
恩德里克

经过一番挖掘，我终于弄明白了。在我的webpack.config.js中，我进行了更改

new webpack.optimize.UglifyJsPlugin({
      sourceMap: true,
      compress: {
        warnings: false
      }
    }),

对此 

optimization: {
    minimizer: [new UglifyJsPlugin()],
  },

问题是我在不删除旧的新webpack.optimize.UglifyJsPlugin的情况下添加了最小化器。我从他们的文档中找到了答案

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

npm run build 抛出错误代码 ELIFECYCLE

已安装Node和npm，但Git bash无法识别“ npm run dev”中的“ node”（其他shell可以正常工作）

Laravel 项目中的“npm run hot”抛出无效配置错误

在`npm run build`时出错

运行“npm run build”时出现 npm run build 错误

vue.js cli命令“ npm run serve”如何工作

npm run dev和npm run build不同的苗条变量值

为什么CSS在`npm run dev`和`npm run build`之间渲染不同？

npm run dev产生UnhandledPromiseRejectionWarning

如何运行`npm run build`

什么是“ npm run dev”和“ npm run prod”

npm run dev 无法安装webpack cli

来自npm-run-build前端的Django中的静态文件抛出错误404

如何从Symfony项目进行'npm run build'

在新vue项目上运行npm run serve时出错

我做了 npm run build 并得到了很多错误

如何解决npm run dev给的错误？

在 npm run build 之前检查 jshint 错误

Vue nuxt npm run dev new img 未找到

无法在我的React应用程序中运行'npm run build'/'npm run deploy'命令

运行“ npm run build”后收到npm错误：npm ERR！代码ELIFECYCLE npm ERR！错误2

自动加载或livereload npm run dev

npm run start:dev 找不到模块

npm run dev --host 网络：未公开

“ npm run build” =“反应脚本：权限被拒绝”

npm run build不使用代理

什么是“ npm run -s build”中的“ -s”

npm run build in php Laravel 挂起或退出

npm run build生产不分配生产

TOP 榜单

  1. 1

    UITableView的项目向下滚动后更改颜色，然后快速备份

  2. 2

    Linux的官方Adobe Flash存储库是否已过时？

  3. 3

    用日期数据透视表和日期顺序查询

  4. 4

    应用发明者仅从列表中选择一个随机项一次

  5. 5

    Mac OS X更新后的GRUB 2问题

  6. 6

    验证REST API参数

  7. 7

    Java Eclipse中的错误13，如何解决？

  8. 8

    带有错误“ where”条件的查询如何返回结果？

  9. 9

    ggplot：对齐多个分面图-所有大小不同的分面

  10. 10

    尝试反复更改屏幕上按钮的位置 - kotlin android studio

  11. 11

    如何从视图一次更新多行（ASP.NET - Core）

  12. 12

    计算数据帧中每行的NA

  13. 13

    蓝屏死机没有修复解决方案

  14. 14

    在 Python 2.7 中。如何从文件中读取特定文本并分配给变量

  15. 15

    离子动态工具栏背景色

  16. 16

    VB.net将2条特定行导出到DataGridView

  17. 17

    通过 Git 在运行 Jenkins 作业时获取 ClassNotFoundException

  18. 18

    在Windows 7中无法删除文件（2）

  19. 19

    python中的boto3文件上传

  20. 20

    当我尝试下载 StanfordNLP en 模型时，出现错误

  21. 21

    Node.js中未捕获的异常错误，发生调用

热门标签

归档