webpack

1.基本使用

webpack.config.js配置好webpack打包的输入与输出文件

var path=require("path")
module.exports={
    entry: path.join(__dirname,"forward-project/webpack/src/index.js"),

    output:{
        path:path.join(__dirname,"forward-project/webpack/dist"),
        filename:"bundle.js"
    },
    devServer:{
        host:'0.0.0.0'
    }
}

2.使用webpack-dev-server自动打包

npm i webpack-dev-server -g全局安装

在package.json中配置运行的命令

script:{
'dev'  :"webpack-dev-server --hot --disable-host-check --port 8081 --host=0.0.0.0 "

}
//运行webpack-dev-server
npm run dev

• --hot 热重载，只打包文件中修改的部分，加快打包

• --disable-host-check 不检查hostname 用于外部主机访问

• --host 指定可以访问的地址

• --port 端口号

• --contentBase 指定运行的时展示的根目录

在webpack.config.js中进行配置,起到同样的效果

        output:{
        path:path.join(__dirname,"forward-project/webpack/dist"),
        filename:"bundle.js"
    },
    devServer:{
        port:8081,
        host:'0.0.0.0',
        disableHostCheck: true,
        contentBase:path.join(__dirname,"forward-project/webpack/"),
        hot:true
    }
}

参考

1. 解决host=0.0.0.0 https://zhuanlan.zhihu.com/p/28502711