码迷,mamicode.com
首页 > Web开发 > 详细

Webpack 4 学习04(配置webpack-dev-server)

时间:2019-02-24 10:36:04      阅读:152      评论:0      收藏:0      [点我收藏+]

标签:serve   lock   port   art   打包   tps   本地服务器   替换   conf   

前提: Webpack 4 学习01(基础配置)

? Webpack 4 学习02(通过配置文件打包)

一、了解 webpack-dev-server

  • webpack-dev-server用来配置本地服务器
  • webpack 打包生成的文件提供web服务
  • 自动刷新和热替换(HMR)

二、安装webpack-dev-server

npm install --save-dev webpack-dev-server

三、 配置webpack.config.js文件

devServer:{
        contentBase:'./dist',  //设置服务器访问的基本目录
        host:'localhost', //服务器的ip地址
        port:8080,  //端口
        open:true  //自动打开页面
}

四、配置package.json

"scripts": {
    "start": "webpack-dev-server --mode development"
 }

五、运行命令

npm run dev 打包文件

npm run start打开服务器

Webpack 4 学习04(配置webpack-dev-server)

标签:serve   lock   port   art   打包   tps   本地服务器   替换   conf   

原文地址:https://www.cnblogs.com/hunterxing/p/10425288.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!