项目nginx部署到非根目录下vue配置方案
更新时间：2023年12月06日 14:47:22 作者：lilongwei4321
这篇文章主要介绍了项目nginx部署到非根目录下vue配置方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
nginx部署到非根目录下vue配置
1、修改config/index.js
2、修改路由route/index
3、若index.html
有引入static中的 js 和images需要配置 webpack.dev.conf.js 和 webpack.prod.conf.js
配置webpack.dev.conf.js ，大概在55行左右增加path配置
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
inject: true,
path: config.dev.assetsPublicPath + config.dev.assetsSubDirectory
}),配置webpack.prod.conf.js ，大概在65行左右增加path配置
new HtmlWebpackPlugin({
filename: config.build.index,
template: 'index.html',
inject: true,
path: config.build.assetsPublicPath + config.build.assetsSubDirectory,
minify: {
removeComments: true,
collapseWhitespace: true,
removeAttributeQuotes: true
// more options:
// https://github.com/kangax/html-minifier#options-quick-reference
},
// necessary to consistently work with multiple chunks via CommonsChunkPlugin
chunksSortMode: 'dependency'
}),4、配置好后再来看一下
index.html引入js吧
<script src=<%= htmlWebpackPlugin.options.path %>/javascript/rem.js></script> <script src=<%= htmlWebpackPlugin.options.path %>/javascript/md5.js></script> <script src=<%= htmlWebpackPlugin.options.path %>/javascript/moment.js></script>
5、引入static中的图片
具体方法参考//www.jb51.net/javascript/3070665dl.htm
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
vue项目报错Extra semicolon (semi)问题及解决
这篇文章主要介绍了vue项目报错Extra semicolon (semi)问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-10-10
在使用Vue.js进行前端开发的过程中,Element UI 是一个非常流行的UI库,它提供了一套完整的组件来快速搭建美观的用户界面,但是我们经常遇到一个问题使用Element UI提供的el-date-picker组件时,尝试自定义其样式却无法生效,所以本文给大家介绍如何解决这个问题2024-10-10
今天小编就为大家分享一篇使用vue根据状态添加列表数据和删除列表数据的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-09-09
这篇文章主要为大家详细介绍了vue前端sku实现的相关方法,文中的示例代码讲解详细,具有一定的借鉴价值,有需要的小伙伴可以参考一下2024-11-11
这篇文章主要给大家介绍了vue如何使用socket与服务端进行通信的相关资料,在Vue中我们可以将Websocket类封装成一个Vue插件,以便全局使用,需要的朋友可以参考下2023-09-09
Vue 3引入了Composition API，这是一套新的API用于编写组件，作为Options API的替代，这篇文章主要介绍了如何优化 Vue.js 应用程序,需要的朋友可以参考下2023-02-02
本文主要介绍了Vue+SpringBoot实现支付宝沙箱支付的示例代码，文中通过示例代码介绍的非常详细，需要的朋友们下面随着小编来一起学习学习吧2021-06-06
这篇文章主要介绍了Vue 子组件传父组件 $emit更新属性方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-09-09
vue中electron框架自定义外部配置文件的配置与读取办法
使用Electron开发本地跨平台的本地程序时,有时需要添加一些程序的配置文件,下面这篇文章主要给大家介绍了关于vue中electron框架自定义外部配置文件的配置与读取的相关资料,需要的朋友可以参考下2023-12-12
这篇文章给大家详细分析了关于VUE的常用的相关指令内容，对此有需要的朋友们可以学习下。2018-08-08
最新评论