webpack使用HtmlWebpackPlugin进行cdn配置

其中build文件夹中的webpackprodconfjs是我们主要注意的文件,我们在该文件中动态设置不需要被打包的模块并构建出合适的链接。

在webpack项目中，所引入的第三方资源会被统一打包进vender文件中，我们通过webpack的 externals 属性可以设置打包时排除该模块，详情说明见 外部扩展(externals) 。

在前面的步骤中，我们创建的项目包括vue、vue-router，在正式开发在还会有ui库，如element-ui，为了方便演示，我们再安装element-ui和axios两个模块，并实现在构建是把这是个模块以cdn的形式引入。

注意安装时记得-S，它的作用是安装完后在packagejson项目文件中插入记录，后续 *** 作需要读取已安装模块

对于cdn，我们可以自己搭建，也可以使用专业的cdn服务商，这里使用免费的cdn bootcdn 。选用免费cdn有很多好处，但毕竟有隐患，那就是服务有可能会奔溃。

依次搜索出前面模块，结果如下

按照规律，得出cdn资源路径规则为

使用cdn其实也就是在webpack热启动和打包项目的时候动态插入script和style链接，为了方便维护，我们通过在build/utilsjs文件上添加几个方法，将来在webpackdevconfjs和webpackprodconfjs上可以使用。

如果没有build/utilsjs，可以在其他文件上添加，只要在后续步骤中能 *** 作到就行

1添加cdn根地址

2添加cdn模块 按照需要删改

这里特别注意scope，它是webpack配置的external参数下的信息，比如vue的作用域命名是Vue，vue-router的作用域命名是VueRouter，element-ui的作用域命名是ELEMENT，同理，jq的作用域命名是JQuery，具体做法是先引入该资源，然后在控制台依次输入近似的值，一个个匹配(目前没找到更好的做法)。

3添加获取版本号方法

4导出不需要被打包的cdn模块配置重点

在webpack热启动本地调试的时候，我们可以使用cdn。

在build/webpackdevconfjs中，默认已经引入了utilsjs，所以可以直接调用相关方法，如果是自定义的文件，记得引入。

紧接着我们在该文件下找到devWebpackConfig下的plugins下的HtmlWebpackPlugin插件，它的作用是动态构建html页面，原始配置如下：

我们可以往里面添加点自定义属性，方便在indexhtml中调用。，修改如下：

其中cdnConfig和onlyCss自定义属性，在html上通过htmlWebpackPluginoptions可以读取到。
更多html-webpack-plugin配置情况官网，这里暂时不需要更多。

webpackprodconfjs添加cdn配置和忽略模块
在打包的时候，我们使用cdn，配置和前面dev的差不多，只不过需要做多一步。

注意此处的externalModules，后面用到，也就是比dev多的步骤。

externals代表构建时不需要被处理的模块，也就是前面说的scope需要注意的地方。

和dev一样，我们修改webpackConfig下的plugins下的HtmlWebpackPlugin插件配置 (这里的默认配置比dev的多，主要是css压缩和js压缩相关)

加入和dev一样的两个配置，不过需要把onlyCss改为true，因为我们希望打包时不单单使用css。

webpack配置已经完成，在html-webpack-plugin中已经添加了相关参数，我们再在页面上可以直接使用，使用语法是ejs，和aspnet，jsp，php类似。

一般是这么做的，在build目录下建一个indexhtml，在里面用javascript或者meta来跳转到你想要的页面。
不用觉得这个方法low，你到时候部署到生产环境的时候也是只能这么干的

server启动后会自动退出 怎么解决
server服务自动关闭很大一部分是由于系统本身存在一定的缺陷和漏洞导致的，也可能是因为木马病毒攻击漏洞问题所致，病毒木马攻击提供文件共享服务ComputerBrowser进程，会导致server服务自动关闭。

server服务自动停止关闭如何解决？
①：右键单击“我的电脑”——“管理”——“服务”中找到server服务，手动启动，以保证网站能够正常访问；
②：使用杀毒软件查杀电脑上是否存在木马病毒，可以及时的对病毒进行处理；
③：如果不使用局域网共享文件服务，建议关闭局域网文件共享功能，因为局域网里面有可能包含ARP病毒， ARP病毒也会导致server服务自动关闭停止。
④：上面我们提到，出现server服务自动关闭停止有可能是系统缺陷漏洞导致，所以及时的更新系统补丁是非常重要的，亲们的电脑如果出现server服务自动停止，请记得更新下面的补丁。（WindowsServer2003-KB958644-x86-CHSexe）

---