实战项目编译后不在根目录下（项目无法编译）怎么办

这一次，我将为您带来如果实际项目在编译后不在根目录中该怎么办。如果编译后实际项目不在根目录中，该怎么办有什么注意事项？以下是实际案例。让我们来看看。

例如:

vue -路由器:历史模式内部网络环境:192.168.1.1:8080/index.html外部网络环境:domain.com/ttsd/index.html.

因为开发的项目将部署在客户端，而客户端不希望仅使用域名（或子域）进行部署，此时，打包的程序将不得不进行一些配置更改。

修改配置文件

1.将打包的资源引用更改为相对路径，并在config/index.js中的build属性下找到assetsPublicPath

版本:{...资产公共路径:“”。/‘/修改前的配置为‘/‘，}

2.修改资源文件（图片、视频、字体文件等）。）作为相对路径被样式引用，并在build/utils.js中找到它们，然后添加（或修改）publicPath作为‘.../.../'

if（options . extract）{ return extracttextplugin . extract（{ use:loaders，fallback:‘vue -style -loader‘，公共路径:‘.././‘/modify path }）} else { return }

修改路线

在路由的历史模式下，所有路由都基于根路径，例如/xxxx。由于部署目录未知，我们可以根据location.pathname获取当前访问文件的路径来修改路径。

vu E-路由器中提供了一个基本属性。

基本类型:字符串默认值:“/”应用程序的基本路径。例如，如果整个单页应用程序服务位于/app/下，则base应设置为“/app/”。

修改路由代码

函数getAbsolutePath（）{ let Path = location . pathname返回Path . substring（0，Path。lastindexof（‘/‘）+1）} const routers = new router（{ mode:‘history‘，base:getabsolutepath（），...}）至此，打包配置的所有相关修改都已完成，项目可以正常访问。但还是会有问题。跳转到某个路由后，刷新页面，就gg了，页面空白。此时，nginx的配置将被修改。

修改nginx的配置

官方的nginx配置在根目录下，即https://router . vue js . org/zh-cn/essentials/history -mode . html # Nginx。

location/{ try _ files $ uri $ uri//index . html；//需要修改为try _ files $ uri $ uri//dist/index . html；}注:/dist根据实际部署的网站目录，修改即可。个人感受也可以通过nginx的内置指令动态获取，这在接下来的情况中并不清楚。

我相信你看完这个案例后已经掌握了方法。更多精彩请关注主机参考其他相关文章！

推荐阅读:

VuePress制作个人网页。

如何绑定箭头键来控制div移动

以上就是实战项目编译后不在根目录下怎么办的细节。更多资讯请关注主机参考其他相关文章！

这几篇文章你可能也喜欢：

• 编译后实际项目不在根目录下怎么办？
• 什么是Ubuntu？有什么用？Ubuntu系统做什么？
• nginx服务器究竟是如何执行PHP项目的
• ZABBIX 4.04安装文档教程详细信息（基于CentOS 7.6）
• ZABBIX远程命令执行示例详细信息

本文由主机参考刊发，转载请注明：实战项目编译后不在根目录下（项目无法编译）怎么办 https://zhujicankao.com/105106.html