简体   繁体   English

webpack v5 devtool 应该匹配模式

[英]webpack v5 devtool should match pattern

Setting up a simple Middleman app utilizing webpack 5, but getting this invalid configuration object error:使用 webpack 5 设置一个简单的 Middleman 应用程序,但收到此无效配置对象错误:

[webpack-cli]
Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema.
 - configuration.devtool should match pattern "^(inline-|hidden-|eval-)?(nosources-)?(cheap-(module-)?)?source-map$".
   BREAKING CHANGE since webpack 5: The devtool option is more strict.
   Please strictly follow the order of the keywords in the pattern.

None of the devtool options listed here seem to give any other error than the one above, nor does leaving out devtool or explicitly making it false.此处列出devtool 选项似乎没有给出除上述错误之外的任何其他错误,也没有遗漏 devtool 或明确将其设为 false。

This is the setup I had working with webpack 4, but would appreciate any insight into what could unblock the invalid configuration error.这是我使用 webpack 4 时的设置,但希望您能深入了解什么可以解除无效配置错误。

My package.json我的 package.json

{
  "name": "webpack5_practice",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "css-loader": "^4.3.0",
    "mini-css-extract-plugin": "^1.0.0",
    "node-sass": "^4.14.1",
    "sass-loader": "^10.0.3",
    "webpack": "^5.0.0",
    "webpack-cli": "^4.0.0"
  }
}

My webpack.config.js我的 webpack.config.js

const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

module.exports = {
  devtool: 'inline-source-map',
  mode: 'development',
  entry: {
    site: ['./source/javascripts/site.js'],
    style: ['./source/stylesheets/site.css.scss'],
  },
  output: {
    path: path.resolve(__dirname, '.tmp/dist'),
    filename: '[name].min.js',
  },
  module: {
    rules: [
      {
        test: /\.(sa|sc|c)ss$/,
        use: [
          MiniCssExtractPlugin.loader,
          'css-loader',
          'sass-loader',
        ],
      }
    ]
  },
  plugins: [new MiniCssExtractPlugin()],
};

My config.rb w/ regards to webpack我的 config.rb 与 webpack 相关

# Webpack
activate :external_pipeline,
  name: :webpack,
  command: build? ? './node_modules/webpack/bin/webpack.js --bail' : './node_modules/webpack/bin/webpack.js --watch -d',
  source: "./dist",
  latency: 1

Answering my own question and editing the original to include my error:回答我自己的问题并编辑原文以包含我的错误:

I was running Webpack through the Middleman external pipeline with the -d flag in config.rb.我在 config.rb 中使用-d标志通过 Middleman 外部管道运行 Webpack。 Removing the flag (or explicitly listing a devtool option) would fix the error.删除标志(或明确列出 devtool 选项)将修复错误。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM