更新所有NPM软件包后,为什么webpack-dev-server不监视CSS更改?

问题描述

它曾经可以工作,但是在我将webpack和webpack-dev-server更新到最新版本之后,它似乎停止监视任何CSS更改。

这些是package.json中的脚本。

我以前曾经使用“ webpack-dev-server” ,而不是使用“ webpack服务” ,但是我读到某处Webpack-dev-server不再起作用

 "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1","start": "webpack serve --mode development --hot","build": "webpack --mode production"
    },

插件版本:

"sass": "^1.26.11","sass-loader": "^10.0.4","style-loader": "^2.0.0","webpack": "^5.3.0","webpack-cli": "^4.1.0","webpack-dev-server": "^3.11.0"

那是我的webpack.config.js。

添加的全部是 devServer 的东西,我以前没有,而且一切正常。

const path = require("path")
const HtmlWebpackPlugin = require("html-webpack-plugin")

module.exports = {
    mode: "development",entry: "./src/index.js",output: {
        path: path.join(__dirname,"/dist"),filename: "[name].js",sourceMapFilename: "[name].js.map",},devServer: {
        contentBase: "/dist",watchContentBase: true,open: true,inline: true,hot: true,module: {
        rules: [
            {
                test: /\.js$/,exclude: /node_modules/,use: ["babel-loader"],{
                test: /\.css$/,use: ["style-loader","css-loader"],{
                test: /\.s[ac]ss$/i,"sass-loader"],{
                test: /\.(jpe?g|png|gif|woff|woff2|eot|ttf|svg)(\?[a-z0-9=.]+)?$/,use: [
                    {
                        loader: "url-loader",options: {
                            limit: 100000,],plugins: [
        new HtmlWebpackPlugin({
            template: "./src/index.html",}),}

很乐意提供帮助!

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)