导读 8月科学教育网小李来为大家讲解下。express，scripts这个很多人还不知道,现在让我们一起来看看吧！webpack-dev-server是：为webpack打包生...

8月科学教育网小李来为大家讲解下。express，scripts这个很多人还不知道,现在让我们一起来看看吧！

webpack-dev-server是：

为webpack打包生成的资源文件提供web服务的小型的Express服务器。但是不能当作后台服务器来使用。

主要功能：

静态文件提供服务

自动刷新和热替换

安装插件：

npm i webpack-dev-server -D

安装插件：

npm i -D html-webpack-plugin

该插件主要作用：

1.生成创建html入口文件

2.为html文件中引入的打包的script、link资源

项目文件夹和文件如下：

common.js内容：

entry.js内容：

index.html内容：

<html>

<head>

<meta charset="UTF-8">

</head>

<body>

<script src="./dist/dist.js"></script>

<div id="app">hello，webpack</div>

<div><button>按钮</button></div>

</body>

</html>

webpack.base.js内容:

添加了plugins 和 devServer的配置

Package.json里面内容为

{

"scripts": {

"build":"webpack --config build/webpack.base.js",

"dev": "webpack serve --config build/webpack.base.js",

}

}

执行 npm run dev后 访问：127.0.0.1：8080

本文express，scripts到此分享完毕，希望对大家有所帮助。