时间戳

首页 > 解决方案 > `npm run watch` 不在开发模式下编译，但在生产中编译（-p 标志）

npm - `npm run watch` 不在开发模式下编译，但在生产中编译（-p 标志）

问题描述

我正在尝试运行 webpack --watch 并且它启动但它没有编译任何东西，它似乎卡住了。我运行 webpack --watch -p 的那一刻，它按预期工作，但速度很慢，我必须等待每次编译至少 20 秒。

我尝试使用 --verbose / --info-verbosity 详细标志获取更多信息，但没有得到任何额外信息。它似乎停留在早期编译中。我试图让生产和开发模式尽可能接近。

var path = require('path')
var webpack = require('webpack')
const VueLoaderPlugin = require('vue-loader/lib/plugin')

module.exports = [{
name: 'viewenvision',
entry:[
    './src/main.js'
],
output: {
    path: path.resolve(__dirname, './public/js/viewenvision/'),
    publicPath: '/public/js/viewenvision/',
    filename: 'build.raw.js'
},
module: {
    rules: [
        {
            test: /\.vue$/,
            loader: 'vue-loader',
            options: {
                loaders: {}
            }
        },
        {
            test: /\.js$/,
            loader: 'babel-loader',
            exclude: /node_modules/
        },
        {
            test: /\.(png|jpg|gif|svg)$/,
            loader: 'file-loader',
            options: {
                name: '[name].[ext]?[hash]'
            }
        },
        {
            test: /\.css$/,
            use: [
                'vue-style-loader',
                'css-loader'
            ]
        },
    ]
},
externals: {
    'vue': 'Vue',
    'vuex': 'Vuex',
    'vue-router': 'VueRouter',
},
resolve: {
    alias: {
        'vue$': 'vue/dist/vue.esm.js'
    }
},
devServer: {
    historyApiFallback: true,
    noInfo: true
},
performance: {
    hints: false
},
watchOptions: {
    poll: 100
},
devtool: '#inline-source-map',
plugins: [
    new VueLoaderPlugin(),
],
}];

我希望 --watch 可以在没有 -p 标志的情况下工作。它没有显示错误并且“卡住”：

$ node_modules/.bin/webpack --watch             

webpack is watching the files…

标签： npmwebpack

解决方案

问题似乎是深度嵌套的 HTML，它没有让 Webpack 卡住，但编译模板花费了疯狂的时间。在这种情况下，罪魁祸首是使用 Prettier 的 VueLoader

问题描述如下：

https://github.com/prettier/prettier/issues/4672

解决方案是添加：

prettify: false

至

{
    test: /\.vue$/,
    loader: 'vue-loader',
    options: {
        prettify: false,
    }
},

推荐阅读