vue-cli npm run build报错 ,resolve is not defined

Question

我在用webpack打包时，运行npm run build，首先报了一个错
'''ERROR in build.js from UglifyJs
Unexpected token: punc (() ./node_modules/element-ui/packages/col/src/col.js:24,0'''
根据搜索到的结果是es6语法问题
然后我把webpack改成了这样
'''
var path = require('path')
var webpack = require('webpack')
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

module.exports = {
entry: './src/main.js',
output: {

path: path.resolve(__dirname, './dist'),
publicPath: '/dist/',
filename: 'build.js'

},
module: {

rules: [
  {
    test: /\.css$/,
    loader: 'style-loader!css-loader'
  },
  {
    test: /\.scss$/,
    use: [
      'vue-style-loader',
      'css-loader',
      'sass-loader'
    ],
  },
  {
    test: /\.sass$/,
    use: [
      'vue-style-loader',
      'css-loader',
      'sass-loader?indentedSytanx'
    ],
  },
  {
    test: /\.(eot|svg|ttf|woff|woff2)$/,
    loader: 'file-loader'
  },
  {
    test: /\.vue$/,
    loader: 'vue-loader',
    options: {
      loaders: {
        // Since sass-loader (weirdly) has SCSS as its default parse mode, we map
        // the "scss" and "sass" values for the lang attribute to the right configs here.
        // other preprocessors should work out of the box, no loader config like this necessary.
        'scss': [
          'vue-style-loader',
          'css-loader',
          'sass-loader'
        ],
        'sass': [
          'vue-style-loader',
          'css-loader',
          'sass-loader?indentedSyntax'
        ]
      }
      // other vue-loader options go here
    }
  },
  {
    test: /\.js$/,
    loader: 'babel-loader',
    include: [resolve('src'),resolve('test'), resolve('/node_modules/iview/src'), resolve('/node_modules/iview/packages')],
    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,
host: '0.0.0.0'

},
performance: {

hints: false

},
devtool: '#eval-source-map'
}

if (process.env.NODE_ENV === 'production') {
module.exports.devtool = '#source-map'
// http://vue-loader.vuejs.org/e...
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 UglifyJsPlugin({

  // 使用外部引入的新版本的js压缩工具

  parallel: true,

  uglifyOptions: {
    ie8: false,
    ecma: 6,
    warnings: false,
    mangle: true,
    // debug false
    output: {
      comments: false,
      beautify: false,
      // debug true
    },

    compress: {
      // 在UglifyJs删除没有用到的代码时不输出警告
      warnings: false,
      // 删除所有的 `console` 语句
      // 还可以兼容ie浏览器
      drop_console:
        true,
      // 内嵌定义了但是只用到一次的变量
      collapse_vars:
        true,
      // 提取出出现多次但是没有定义成变量去引用的静态值
      reduce_vars:
        true,
    }
  }
}),
new webpack.LoaderOptionsPlugin({
  minimize: true
})

])
}

'''

再次运行npm run build,结果报错
'''
path: path.resolve(__dirname, './dist'),

           ^

ReferenceError: resolve is not defined

at Object.<anonymous> (C:\Users\yingyi\Desktop\yingyi\webpack.config.js:8:16)
at Module._compile (module.js:635:30)
at Object.Module._extensions..js (module.js:646:10)
at Module.load (module.js:554:32)
at tryModuleLoad (module.js:497:12)
at Function.Module._load (module.js:489:3)
at Module.require (module.js:579:17)
at require (internal/module.js:11:18)
at requireConfig (C:\Users\yingyi\Desktop\yingyi\node_modules\webpack\bin\convert-argv.js:97:18)
at C:\Users\yingyi\Desktop\yingyi\node_modules\webpack\bin\convert-argv.js:104:17

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! yingyi@1.0.0 build: cross-env NODE_ENV=production webpack --progress --hide-modules
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the yingyi@1.0.0 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! C:UsersyingyiAppDataRoamingnpm-cache_logs2018-05-21T11_19_19_460Z-debug.log
'''
请问这是什么原因呢

Answer 1

解决了吗？

可以在webpack的配置文件里面  加一个辅助函数就不报错了

function resolve (dir) {
return path.join(__dirname, '..', dir)
}

Answer 2

我也遇到这个问题了，记录一下
项目是 vue cli3 创建的
配置别名 chainWebpack ，但是出现，resolve is not defined

解决：在vue.config.js 文件中 module.exports 上面添加

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

function resolve(dir) {
  return path.join(__dirname, dir)
}

Answer 3

建议在 webpack.config.js 中打出 path 对象，看看这个对象有没有 resolve 方法，一般是有的

Answer 4

我也遇到了这个问题，后来发现是其他配置引起，建议用二分法尝试哪一行的配置导致的，希望对你有帮助

Answer 5

node什么版本的？可以运行node -v 查看

Answer 6

楼主有解决么？我也遇到了同样的问题

Answer 7

楼主有解决吗 我q：1242798726 万望求解