项目构建过程分析与实现

为什么需要打包项目？

浏览器只能识别并运行 html、css、js 文件 。
那么换句话而言，项目中的 .vue 文件，浏览器是不认识的。
而打包的过程就是把 .vue 的 单文件组件 打包成 html、css、js 的文件，让浏览器进行识别，并展示我们的项目

打包之后可以通过浏览器直接访问吗？

通过 npm run build 打包项目之后，打包的文件会被放入到 dist 文件夹中，其实我们可以直接双击 index.html 文件，可以发现，浏览器是 无法 显示项目的。
打开 F12 可以发现，终端中抛出了很多的错误。
那么根据这些错误可以知道，无法显示的原因是因为 一些文件找不到了。
那么为什么找不到呢？
查看我们的 url 可以发现，其实我们的 url 是一个 file 协议。那么对应的文件路径就会编程 盘符下的 xxx ，在我们当前的盘符下没有对应的文件，那么自然是无法找到的。
而想要解决这个问题的话，就需要把我们的项目运行到一个 服务 中，就像我们开发时的 devServer 一样。

问什么需要有服务？

我们需要通过一个 服务 托管我们的项目，从而避免出现模块无法被找到等问题。