webpack搭建本地服务器

1 介绍

• 基于node.js搭建，内部使用express框架，可以实现我们想要的让浏览器自动刷新显示我们修改后的结果。
• deserver也是作为webpack中的一个选项，选项本身可以设置如下属性

（1）contentBase：为哪一个文件夹提供本地服务，默认是跟文件夹，我们这里可以填写./dist

（2）port：端口号

（3）inline：页面实时刷新

（4）historyApiFallback：在SPA页面中，依赖HTML5的history模式

2 安装

代码语言：shell复制

# 安装，提供一个开发时服务
npm install webpack-dev-server@2.9.3 --save-dev

webpack.config.js

代码语言：javascript复制

module.exports = {
  ...
  devServer: {
    contentBase: './dist',
    inline: true
  }
}

3 启动

代码语言：shell复制

# 初始命令
.node_modules.bin/webpack-dev-server

# 脚本化（package.json中的scripts设置）
"dev":"webpack-dev-server --open"

前端 webpack2

0 人点赞