webpack4.0-devServer的使用-04

拜拜、爱过 提交于 2019-12-20 20:19:56

修改文件后自动打包配置(监听源代码变动打包)

第一种方法:

package.json文件配置scripts

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "bundle": "webpack",
    "watch": "webpack --watch" // 监听源代码变动,自动打包
  },

第二种方法:

通过webpack的devServer实现监听打包,安装webpack-dev-server

// webpack.config.js中的配置
devServer: {
    contentBase: './dist', // 定义服务器启动服务的位置
    open: true , // 启动webpack devServer的时候自动打开浏览器
    proxy: { // 用于跨域配置

   },
   port: 8089, // 定义服务的端口号
}

package.json中的配置

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "bundle": "webpack",
    "server": "webpack-dev-server" // webpack-dev-server启动本地服务
  },

 

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!