提升webpack效率

1. webpack --watch

"scripts": {
    "build": "webpack --watch"
  },

在webpack后添加--watch

npm run build 的时候就可以实时监听改动,自动打包,刷新浏览器就可以看到改变

2. webpack-dev-server

之前写过就不写啦~ 优点:监听改动,自动打包,自动刷新浏览器页面

3. 自己写一个服务器(了解)

"scripts": {
    "build": "webpack --watch",
    "dev": "webpack-dev-server",
    "middleware": "node server.js"
  }

npm run middleware 执行 server.js,借助koa、wepack-dev-middleware

const Koa = require('koa')
const webpack = require('webpack')
const webpackDevMiddleWare = require('webpack-dev-middleware')
const config = require('./webpack.config.js') // 引入配置文件
const complier = webpack(config)
const app = new Koa()
app.use(webpackDevMiddleWare(complier, {
  publicPath: config.output.publicPath
}))
app.listen('8000', () => {
  console.log('server is running at 8000')
})

在node中直接使用webpack

 

 


版权声明:本文为Luckyzhoufangbing原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。