vue-cli项目包：

1.命令行输入：npm运行构建

打包后，项目中会有一个额外的文件夹dist，这就是我们打包的项目。

第一个问题是文件引用路径。当我们直接运行打包文件夹中的index.html文件时，我们会看到网页是空白的，f12调试充满了css和js路径引用错误。

解决方案：在配置文件夹中打开index.js文件。

文件中有两个资产公共路径属性。更改第一个属性，即在构建中更改assetsPublicPath属性：

assetsPublicPath属性指定编译和发布的根目录。/'是指项目的根目录，而'。“/”指的是当前目录。

修改后，重新打包项目并运行index.html文件。我们可以看到没有报告错误。但是路由器视图的内容无法显示。

第二个问题：路由器视图中的内容无法显示。路由历史模式。

这个坑是当你使用路由后打开没有后端协作的路由历史模式，打包的文件会是空白的。

很多人花很多时间踩这个坑，网上教程基本都是第一个坑，很少被人提起。

解决方案：//mode:“历史记录”，//只需关闭此模式

这并不是说这个模式不能打开。这种模式需要后端设置的配合。有关详细信息，请参阅：工艺路线文档

以上文章解决了vue-cli项目打包中的空白页和路径错误问题，是边肖分享的全部内容。希望能给大家一个参考，支持我们。