首页 文章

WebpackOptionsValidationError:无效的配置对象

提问于
浏览
0

我正在通过一个在线课程,当我尝试运行我的服务器时,我得到了这个错误,但无法解决原因:

/Applications/XAMPP/xamppfiles/htdocs/projects/distdesign/node_modules/webpack/lib/webpack.js:19抛出新的WebpackOptionsValidationError(webpackOptionsValidationErrors); ^

WebpackOptionsValidationError:无效的配置对象 . Webpack已使用与API架构不匹配的配置对象进行初始化 . - 配置具有未知属性'devtools' . 这些属性是有效的: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将这些选项传递给loader:plugins:[new webpack.LoaderOptionsPlugin({// test:/.xxx$ /,//可能仅适用于某些模块选项:{devtools: ...}})] - configuration.resolve.extensions [0]不应为空 . 在webpack(/Applications/XAMPP/xamppfiles/htdocs/projects/distdesign/node_modules/webpack/lib/webpack.js:19:9)在Object . (/Applications/XAMPP/xamppfiles/htdocs/projects/distdesign/server/index.js:9:27)在loader./compile(module.js:573:30)的loader(/ Applications / XAMPP / xamppfiles / htdocs / projects) /distdesign/node_modules/babel-register/lib/node.js:144:5)在Object.require.extensions . (匿名函数)[as .js](/ Applications / XAMPP / xamppfiles / htdocs / projects / distdesign / node_modules /babel-register/lib/node.js:154:7)在Module.load(module.js:507:32)的tryModuleLoad(module.js:470:12)处于Function.Module._load(module.js: 462:3)在Object的Function.Module.runMain(module.js:609:10) . (/Applications/XAMPP/xamppfiles/htdocs/projects/distdesign/node_modules/babel-cli/lib/_babel-node.js:154:22)[nodemon]应用程序崩溃 - 在开始之前等待文件更改...

这是我的webpack配置文件:

import path from 'path';

export default {
    devtools: 'eval-source-map',
    entry: path.join(__dirname, '/client/index.js'),
    output: {
        path: '/'
    },
    module: {
        loaders: [
            {
                test: /\.js$/,
                include: path.join(__dirname, 'client'),
                loaders: [ 'babel' ]
            }
        ]
    },
    resolve: {
        extensions: [ '', '.js' ]
    }
}

2 回答

  • 0

    首先,向我们提供有关您的webpack配置文件名称的信息 . 默认名称为: webpack.config.babel.js

    其次,在复制并粘贴代码段运行之前,我对您的webpack文件进行了一些更改: npm install webpack@2.3 babel-preset-es2015 babel-preset-react babel-loader or
    yarn add webpack@2.3 babel-preset-es2015 babel-preset-reac babel-loader ,之后尝试我的片段:

    import path from 'path';
    import webpack from 'webpack';
    
    const config =  {
        devtools: 'eval-source-map',
        entry: path.join(__dirname, '/client/index.js'),
        output: {
            path: '/'
        },
        module: {
            rules: [
                {
                    test: /\.jsx$/,
                    include: path.join(__dirname, 'client'),
                    loader: 'babel-loader',
                    options: {
                      presets: [['es2015', { modules: false }], 'react'],
                    },
                }
            ]
        },
        resolve: {
            extensions: [ '', '.js' ]
        }
    }
    
    module.exports = config;
    

    如果仍然无法正常工作,请带上package.json文件和输出错误 .

    我希望它有所帮助

  • 0

    当我使用最新的webpack和最新的webpack-dev-server时,我遇到了同样的问题 . 我使用旧版本,问题得到解决 .

    的package.json

    "devDependencies": {
        "webpack": "^1.12.13",
        "webpack-dev-server": "^1.14.1"
    }
    

相关问题