webpack.config.js配置

初学webpack,配置一直报错,求指正

webpack.config.js如下:

var path = require('path')
var UglifyJsPlugin = require('uglifyjs-webpack-plugin')
var Webpack = require('webpack')

module.exports = {
    // 入口文件
    entry: __dirname + '/src/main.js',
    output: {
        // 打包后输出的目录
        path: __dirname + '/dist',
        // 打包后资源文件的前缀
        // publicPath: '/dist/',
        filename: 'build.js'
    },
    resolve: {
        modules: [path.resolve(__dirname, './dist'),'node_modules'],
        extensions: ['*','.js', '.vue'],
    },
    // 处理不同后缀的文件
    module: {
        rules: [{
            test: /\.vue$/,
            use: 'vue'
        }, {
            test: /\.js$/,
            use: ['babel-loader'],
            exclude: /node_modules/
        }, {
            test: /\.css$/,
            use: ['vue-style-loader','css-loader']
        }, {
            test: /\.less$/,
            use: ['vue-style-loader','css-loader','less-loader']
        }, {
            test: /\.(png|jpg|gif|svg)$/,
            use: 'file',
            options: {
                name: '[name].[ext]?[hash]'
            }
        }]
    },
    plugins: [
      new Webpack.ProvidePlugin({
        $: 'jquery',
        jQuery: 'jquery',
        'window.jQuery': 'jquery'
      }),
      new UglifyJsPlugin({
        sourceMap: true
      })
    ],
    // webpack-dev-server配置
    devServer: {
        historyApiFallback: true,
        noInfo: true
    },
    // 开启source-map,webpack有多种source-map,在官网文档可以查到
    devtool: '#eval-source-map'
}

// 生产环境,运行npm run build则执行这里
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({
            compress: {
                warnings: false
            }
        })
    ])
}

package.json如下:

{
  "name": "vue-chatter",
  "version": "1.0.0",
  "description": "chatapp",
  "main": "./src/main.js",
  "scripts": {
    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
  },
  "author": "apple",
  "license": "ISC",
  "dependencies": {
    "jquery": "^3.2.1",
    "vue": "^2.3.3"
  },
  "devDependencies": {
    "babel-core": "^6.24.1",
    "babel-loader": "^7.0.0",
    "css-loader": "^0.28.4",
    "uglifyjs-webpack-plugin": "^0.4.3",
    "vue-loader": "^12.2.1",
    "vue-template-compiler": "^2.3.3",
    "expose-loader": "^0.7.3",
    "webpack": "^2.6.1",
    "webpack-dev-server": "^2.4.5"
  }
}

错误提示如下:

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration.output has an unknown property 'chunkLoadTimeout'. These properties are valid:
   object { auxiliaryComment?, chunkFilename?, crossOriginLoading?, devtoolFallbackModuleFilenameTemplate?, devtoolLineToLine?, devtoolModuleFilenameTemplate?, filename?, hashDigest?, hashDigestLength?, hashFunction?, hashSalt?, hotUpdateChunkFilename?, hotUpdateFunction?, hotUpdateMainFilename?, jsonpFunction?, library?, libraryTarget?, path?, pathinfo?, publicPath?, sourceMapFilename?, sourcePrefix?, strictModuleExceptionHandling?, umdNamedDefine? }
   Options affecting the output of the compilation. `output` options tell webpack how to write the compiled files to disk.
阅读 7.4k
2 个回答

chunkLoadTimeout你找下这个变量是啥

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题