Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/webpack/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 出现语法错误后,webpack dev服务器停止编译,需要重新启动_Javascript_Webpack_Webpack Dev Server - Fatal编程技术网

Javascript 出现语法错误后,webpack dev服务器停止编译,需要重新启动

Javascript 出现语法错误后,webpack dev服务器停止编译,需要重新启动,javascript,webpack,webpack-dev-server,Javascript,Webpack,Webpack Dev Server,我的网页开发服务器正常工作,实时更新正常,一切都很好 但是,如果我保存了一个有语法错误的文件,服务器就会停止编译,并要求我重新启动它以使其重新工作 例如,假设我意外地在.scss文件中添加了一个额外的逗号,webpack dev服务器会输出以下错误: Module build failed (from ./node_modules/sass-loader/dist/cjs.js): SassError: Invalid CSS after '...oto Condensed",': expect

我的网页开发服务器正常工作,实时更新正常,一切都很好

但是,如果我保存了一个有语法错误的文件,服务器就会停止编译,并要求我重新启动它以使其重新工作

例如,假设我意外地在.scss文件中添加了一个额外的逗号,webpack dev服务器会输出以下错误:

Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Invalid CSS after '...oto Condensed",': expected expression (e.g. 1px, bold), was ", sans-serif;"
        on line 18 of /Users/r/Documents/sol/src/styles/app.scss
>>   font-family: "Roboto Condensed",, sans-serif;

   ----------------------------------^

 @ ./src/styles/app.scss 2:26-181
 @ ./src/index.jsx
ℹ 「wdm」: Failed to compile.
但是,当我通过删除逗号并保存文件来修复错误时,服务器不会像通常那样重新编译(它似乎根本不会输出任何内容)。我必须杀死webpack dev服务器并重新启动它

我在网上发现的最接近我的问题是这个,但那里的解决方案并没有解决我的问题

这是我的webpack.config.js:

const path = require('path');

module.exports = {
    entry: path.resolve(__dirname, 'src', 'index.jsx'),

    output: {
        path: path.resolve(__dirname, 'output'),
        filename: 'bundle.js'
    },

    devServer: {
        publicPath: '/output/',
        contentBase: path.resolve(__dirname, 'src'),
    },
    resolve: {
        extensions: ['.js', '.jsx']
    },
    module: {
        rules: [
            {
                test: /\.jsx/,
                use: {
                    loader: 'babel-loader',
                    options: { presets: ['@babel/preset-react', '@babel/preset-env'] }
                }
            },
            {
                test: /\.scss/,
                use: ['style-loader', 'css-loader', 'postcss-loader', 'sass-loader']
            }
        ]
    }
};

服务器在发生错误后停止编译是正常行为吗?或者有一个标志我可以更改,这样我就不必在每次出现语法错误后重新启动服务器了吗?

我不确定这是否与您的网页配置有关,但在我删除
prettier
prettier网页插件之前,我遇到了同样的问题。在我的日志中,我注意到这就是崩溃发生的地方:

✖ 「wdm」: SyntaxError: Unexpected token (100:3)
   98 | // cull whenever the viewport moves
   99 | PIXI.Ticker.shared.add(() =>
> 100 |   if (viewport.dirty) {
      |   ^
  101 |     if (viewport.top < chunk.top) loadChunk('top');
  102 |     if (viewport.left < chunk.left) loadChunk('left');
  103 |
    at t (./node_modules/prettier/parser-babel.js:1:379)
    at Object.parse (./node_modules/prettier/parser-babel.js:1:346226)
    at Object.parse (./node_modules/prettier/index.js:13625:19)
    at coreFormat (./node_modules/prettier/index.js:14899:14)
    at format (./node_modules/prettier/index.js:15131:14)
    at ./node_modules/prettier/index.js:57542:12
    at Object.format (./node_modules/prettier/index.js:57562:12)
    at ./node_modules/prettier-webpack-plugin/index.js:70:47
    at FSReqCallback.readFileAfterClose [as oncomplete] (node:internal/fs/read_file_context:69:3)
ℹ 「wdm」: wait until bundle finished: /
ℹ 「wdm」: wait until bundle finished: /```
✖ 「wdm:语法错误:意外标记(100:3)
98 |//视口移动时进行消隐
99 | PIXI.Ticker.shared.add(()=>
>100 |如果(视口脏){
|   ^
101 |如果(viewport.top