webpack-dev-server和html-webpack-plugin的簡單使用

安裝這兩個包

使用npm安裝 webpack-dev-server html-webpack-plugin

webpack.config.js 配置文件添加html-webpack-plugin插件

...
const HtmlWebpackPlugin = require('html-webpack-plugin');
const htmlWebpackPlugin = new HtmlWebpackPlugin({
    template: 'path/to/file.html',  // 輸入文件
    filename: 'path/to/file.html',  // 輸出文件
});

module.exports = {
    ...
    plugins: [
        htmlWebpackPlugin  // 添加插件
    ],
    ...
}
    

webpack-dev-server 命令，在package文件中添加腳本命令。

--host x.x.x.x  // 啟動的ip地址
--port 3000    // 監聽的端口號