Vue项目打包部署到xampp（Apache）部署目录：D:xampp/htdocs/h5，部署到根目录下的子目录。参考：https://router.vuejs.org/zh/g...如果部署到子目录，需要使用VueCLI的publicPath选项和相关的routerbase属性。您还需要配置后端以将根目录调整为子目录（例如，将RewriteBase/替换为RewriteBase/name-of-your-subfolder/）。具体操作如下：1、修改xampp的httpd.conf，开启rewrite_module功能：去掉LoadModulerewrite_modulelibexec/apache2/mod_rewrite.so前面的#。将AllowOverrideNone更改为AllowOverrideAll以使.htaccess文件生效。AllowOverridenone#RequirealldeniedOptions+ExecCGIOrderallow,denyAllowfromall更改为：#AllowOverridenoneAllowOverrideAll#RequirealldeniedOptions+ExecCGIOrderallow,denyAllowfromall2。新建.htaccess文件在htdocs/h5目录下新建.htaccess文件，否则刷新页面时服务器会直接报404错误。.htaccess文件内容：RewriteEngineOnRewriteBase/flowmesh/RewriteRule^index.html$-[L]RewriteCond%{REQUEST_FILENAME}!-fRewriteCond%{REQUEST_FILENAME}!-dRewriteRule。/流网/索引。html[L]RewriteBase/改为RewriteBase/flowmesh/RewriteRule。/index.html[L]更改为RewriteRule。/flowmesh/index.html[L]我的理解：在地址栏/h5/输入http://localhost，默认请求是index.html页面，vue默认路由是跳转到首页。地址栏变成http://localhost/h5/home，请求的home.html页面（不存在）。但是vue是单页的，请求所有页面应该返回index.html。这句话的意思是请求所有页面返回/flowmesh/index.html。创建一个.htaccess文件：可以先创建一个文本文件，然后“另存为”：3.修改路由的base选项constrouter=newVueRouter({base:process.env.BASE_URL,//即vue.config.jspublicPathvaluemode:'history',routes})4.vue.config.js的publicPath选项constTerserPlugin=require('terser-webpack-plugin')module.exports={publicPath:process.env.NODE_ENV==='生产'？'/h5':'/',productionSourceMap:false,//打包后无法追踪组件，无法追踪组件源码configureWebpack:{resolve:{alias:{'assets':'@/assets','common':'@/common','components':'@/components','network':'@/network','pages':'@/pages','mixins':'@/mixins'}},optimization:{minimizer:[newTerserPlugin({terserOptions:{compress:{drop_console:true//打包时去掉控制台语句}}})]}}}5.npmrunbuildprocess.env.NODE_ENV==='production'?'/h5':构建'/'时，根据实际部署目录替换'/h5'，记录打包中遇到的一些问题，可能会导致部分表述不准确，后续会补充修改。
