webpack-dev-server的命令参数

1.基本命令:webpack-dev-server

加在package.json中scripts对象中

 "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "dev": "webpack-dev-server !!!!!加在这里!!!!!",
    "build": "webpack --config webpack.config.js"
  },
  1. 自动打包后自动打开浏览器
    –open
    加在scripts中的dev
  2. 修改端口
    –port 端口号
  3. 自动打开某个路径
    –contentBase 路径
  4. 热重载
    –hot
    局部更新,不整个文件重新打包
    可以使浏览器异步刷新

2.webpack-dev-server第二种配置命令方式

webpack-dev-server配置命令
在webpack.config.js中进行配置

  1. 命令配置
    在webpack.config.js中的module.exports中增加
devServer:{
open;true,
port:端口号,
contentBase:'路径',
hot:true
}
  1. 启用热更新
    hot:true
    获取webpack对象
const webpack=require('webpack')

在webpack.config.js中的module.exports中增加
//配置热更新的模块对象

plugins:[
	new webpack.HotModuleReplacementPlugins({
            template:path.join(__dirname,'需要打包的html文件路径'),
            filename:'index.html'//输出的文件路径,用于直接访问
        })
]

你可能感兴趣的:(webpack学习笔记)