webpack進行實時打包-watch

watch的使用

改過代碼立即打包一份實體文件出來:
watch: true,
watchOptions: {}

let path = require('path');
let HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
    // 多入口
    mode: 'development',
    entry: {
        home: './src/index.js',
    },
    watch: true,
    watchOptions: { // 監控的選項
        poll: 1000,  // 每秒尋問我多少次
        aggregateTimeout: 500, // 防抖,  過完500ms再進行
        ignored: /node_modules/,  // 不需要監控哪個文件
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/preset-env']
                    }
                }
            }
        ]
    },
    output: {
        // 這裏的 name代表 home, other
        filename: '[name].js',
        path: path.resolve(__dirname, 'dist')
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: "./index.html",
            filename: "index.html",
            chunks: [
                "home",
            ],
        })
    ]
};

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章