Webpack开发服务器配置- contentBase在最新版本中不工作

6pp0gazn 于 2022-12-27 发布在 Webpack

关注(0)|答案(9)|浏览(173)

当我将webpack升级到4.0.0-beta.3并运行npx webpack serve时，我收到以下错误：

[webpack-cli] Invalid configuration object. Object has been initialized using a configuration object that does not match the API schema.
 - configuration has an unknown property 'contentBase'. These properties are valid:
   object { bonjour?, client?, compress?, devMiddleware?, firewall?, headers?, historyApiFallback?, host?, hot?, http2?, https?, liveReload?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, public?, setupExitSignals?, static?, transportMode?, watchFiles? }

这是我在Python 3.11.2中使用的webpack.config.js：

const path = require('path');
const ArcGISPlugin = require("@arcgis/webpack-plugin");

module.exports = {
  mode: 'development',
  entry: {
      main: './app/main.js'
  },
  plugins: [
      new ArcGISPlugin()
  ],
  devServer: {
      contentBase: './'
  }
}

来自package.json的我的设备依赖项：

"devDependencies": {
    "@arcgis/webpack-plugin": "^4.18.0",
    "dojo-typings": "^1.11.11",
    "webpack-cli": "^4.7.2",
    "webpack-dev-server": "^4.0.0-beta.3"

我需要如何更新我的配置以获得最新版本的工作？当我取出dev服务器对象时，服务器将运行，但服务内容来自不存在的./public。
我是新的webpack，所以我还不熟悉的应用程序，配置和要求。

webpack

来源：https://stackoverflow.com/questions/67926476/webpack-dev-server-config-contentbase-not-working-in-latest-version

9条答案

按热度按时间

r1wp621o1#

devServer: {
  static: './'
}

我应该更仔细地阅读错误。上面的对象使我的配置再次工作。

赞(0）回复(0）举报 2022-12-27

sgtfey8w2#

使用static代替，因为contentBase在最新Webpack v5中已弃用

devServer: {
    static: {
      directory: path.join(__dirname, "./")
    },

Full details: https://webpack.js.org/configuration/dev-server/#devserver

赞(0）回复(0）举报 2022-12-27

rjee0c153#

devServer: {
    static: {
      directory: path.join(__dirname, "public")
    },

    compress: true,
    port: 3010, // default 8000
  },

赞(0）回复(0）举报 2022-12-27

rggaifut4#

instead of contentBase we are using static


enter code here
const path = require("path");

module.exports = {
  entry: "./app/Main.js",
  output: {
    publicPath: "/",
    path: path.resolve(__dirname, "app"),
    filename: "bundled.js"
  },
  mode: "development",
  devtool: "source-map",
  devServer: {
    port: 3000,
    static: {
      directory: path.join(__dirname, "app")
    },

    hot: true,
    historyApiFallback: { index: "index.html" }
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /(node_modules)/,
        use: {
          loader: "babel-loader",
          options: {
            presets: ["@babel/preset-react", ["@babel/preset-env", { targets: { node: "12" } }]]
          }
        }
      }
    ]
  }
};

赞(0）回复(0）举报 2022-12-27

sf6xfgos5#

使用static: './directory-name'代替contentBase: './directory-name'
示例：

devServer: {
  static: './dist'
}

赞(0）回复(0）举报 2022-12-27

wydwbb8l6#

我使用的是节点v18，我删除并安装了v16。然后我将代码库更改为静态。这对我很有效
设备服务器：{历史应用程序回退：真，静态：路径.resolve（__目录名，'./dist'），打开：true，压缩：真，热：真，端口：8080，主机：'本地主机' }，

赞(0）回复(0）举报 2022-12-27

ifsvaxew7#

把clean设为false也很重要。我也遇到过......

webpackConfig = {
  output: {
    clean: false
  }
}

赞(0）回复(0）举报 2022-12-27

oprakyz78#

Webpack 5中的热模块重新加载通过以下方式启用：

devServer: {
   port: 8080,
   hot: "only",
   static: {
      directory: path.join(__dirname, './'),
      serveIndex: true,
    },
 },

赞(0）回复(0）举报 2022-12-27

cwdobuhd9#

只需从配置选项中删除contentBase
删除网络包配置.设备服务器.内容库
例如：删除网络包配置.设备服务器.内容库
return merge（webpackConfig，{....您剩余的代码

赞(0）回复(0）举报 2022-12-27

我来回答

Webpack开发服务器配置- contentBase在最新版本中不工作

9条答案

相关问题

热门标签

最新问答