Question

这是我的webpack.config.js：

const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {
    entry: './src/App.jsx',
    output: {
        path: path.resolve(__dirname, 'dist'),
        publicPath: '/dist/',
        filename: 'js/app.js'
    },
    resovle: {
        alias: {
            page: path.resolve(__dirname, 'src/page')
        }
    },
    module: {
        rules: [
            {
                test: /\.jsx$/,
                exclude: /node_modules/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['env', 'react']
                    }
                }
            },
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: "css-loader"
                })
            },
            {
                test: /\.scss$/,
                use: ExtractTextPlugin.extract({
                    fallback: 'style-loader',
                    use: ['css-loader', 'sass-loader']
                })
            },
            {
                test: /\.(png|jpg|gif)$/,
                use: [
                    {
                      loader: 'url-loader',
                      options: {
                          limit: 8192,
                          name: 'resource/[name].[ext]'
                      }
                    }
                ]
            },
            {
                test: /\.(woff|woff2|eot|ttf|otf|svg)$/,
                use: [
                    {
                      loader: 'url-loader',
                      options: {
                          limit: 8192,
                          name: 'resource/[name].[ext]'
                      }
                    }
                ]
            }  
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: './src/index.html'
        }),
        new ExtractTextPlugin('css/[name].css'),
    //公共模块
        new webpack.optimize.CommonsChunkPlugin({
            name: 'common',
            filename: 'js/base.js'
        })
    ],
    devServer: {
        port: 8081
    }
  };

我使用webpack@3.10.0，webpack-dev-server @ 2.9.7，当我＆＃34; npm运行dev＆＃34;得到这个错误。

无效的配置对象。 Webpack已使用与API架构不匹配的配置对象进行初始化。 - 配置具有未知属性＆＃39; resovle＆＃39;。这些属性是有效的： object {amd？，bail？，cache？，context？，dependencies？，devServer？，devtool ?, entry，externals？，loader？，module ?, name？，node？，output？，parallelism？，performance？，plugins ？，profile？，recordsInputPath？，recordsOutputPath？，recordsPath？，resolve？，resolveLoader？，stats？，target？，watch？，watchOptions？ } 错别字：请纠正。对于加载程序选项：webpack 2不再允许配置中的自定义属性。应该更新加载程序以允许通过module.rules中的加载程序选项传递选项。在加载器更新之前，可以使用LoaderOptionsPlugin将这些选项传递给加载器：插件：[ new webpack.LoaderOptionsPlugin（{ // test：/.xxx$ /，//可能仅适用于某些模块选项：{ resovle：... } }） ] 错误的ERR！代码ELIFECYCLE 错误的ERR！错误1 错误的ERR！ backend@1.0.0 dev：webpack-dev-server --open 错误的ERR！退出状态1 错误的ERR！错误的ERR！在backend@1.0.0开发脚本中失败。错误的ERR！这可能不是npm的问题。上面可能有额外的日志记录输出。

npm ERR！可以在以下位置找到此运行的完整日志：错误的ERR！ C：\ Users \用户管理\应用程序数据\漫游\ NPM-cache_logs \ 2018-03-21T09_48_18_093Z-的debug.log

如何更改webpack.config.js？

Answer 1

您的Webpack配置中存在拼写错误。检查单词array并将其更改为resovle。

resolve

消息错误告诉您错误： resolve { alias: { page: path.resolve(__dirname, 'src/page') } }

配置对象无效。 Webpack是否已使用与API架构不匹配的配置对象进行初始化？

1 个答案: