項目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.dbjr.com.cn/javascript/3070665dl.htm
總結
以上為個人經驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
vue項目報錯Extra?semicolon?(semi)問題及解決
這篇文章主要介紹了vue項目報錯Extra?semicolon?(semi)問題及解決方案,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10
在使用Vue.js進行前端開發(fā)的過程中,Element?UI?是一個非常流行的UI庫,它提供了一套完整的組件來快速搭建美觀的用戶界面,但是我們經常遇到一個問題使用Element?UI提供的el-date-picker組件時,嘗試自定義其樣式卻無法生效,所以本文給大家介紹如何解決這個問題2024-10-10
使用vue根據狀態(tài)添加列表數據和刪除列表數據的實例
今天小編就為大家分享一篇使用vue根據狀態(tài)添加列表數據和刪除列表數據的實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
這篇文章主要為大家詳細介紹了vue前端sku實現的相關方法,文中的示例代碼講解詳細,具有一定的借鑒價值,有需要的小伙伴可以參考一下2024-11-11
這篇文章主要給大家介紹了vue如何使用socket與服務端進行通信的相關資料,在Vue中我們可以將Websocket類封裝成一個Vue插件,以便全局使用,需要的朋友可以參考下2023-09-09
Vue?3引入了Composition?API，這是一套新的API用于編寫組件，作為Options?API的替代，這篇文章主要介紹了如何優(yōu)化?Vue.js?應用程序,需要的朋友可以參考下2023-02-02
本文主要介紹了Vue+SpringBoot實現支付寶沙箱支付的示例代碼，文中通過示例代碼介紹的非常詳細，需要的朋友們下面隨著小編來一起學習學習吧2021-06-06
這篇文章主要介紹了Vue?子組件傳父組件?$emit更新屬性方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
vue中electron框架自定義外部配置文件的配置與讀取辦法
使用Electron開發(fā)本地跨平臺的本地程序時,有時需要添加一些程序的配置文件,下面這篇文章主要給大家介紹了關于vue中electron框架自定義外部配置文件的配置與讀取的相關資料,需要的朋友可以參考下2023-12-12
這篇文章給大家詳細分析了關于VUE的常用的相關指令內容，對此有需要的朋友們可以學習下。2018-08-08