詳解Vue項(xiàng)目的打包方式(生成dist文件)
一、相關(guān)配置
情況一（使用的工具是 vue-cil）
如果是用 vue-cli 創(chuàng)建的項(xiàng)目，則項(xiàng)目目錄中沒(méi)有 config 文件夾，所以我們需要自建一個(gè)配置文件；在根目錄 src 下創(chuàng)建文件 vue.config.js，需注意文件名稱必須是 vue.config.js，然后在文件中插入以下代碼：
//打包配置文件
module.exports = {
assetsDir: 'static',
parallel: false,
publicPath: './',
};結(jié)構(gòu)如下：
情況二（使用的工具是 webpack）
如果使用的是 webpack，則直接在 config 中 index.js 文件下修改 webpack 配置：
assetsPublicPath: './'
結(jié)構(gòu)如下：
二、打包
配置完成之后，調(diào)起控制臺(tái)，輸入打包命令 npm run build 開始打包；
成功后會(huì)有如下提示；
且會(huì)在項(xiàng)目目錄自動(dòng)生成 dist 文件夾；
dist 文件夾就是我們需要的包，隨后放至服務(wù)器部署上線即可；需要注意打包之后無(wú)論在項(xiàng)目中做了何種修改，都需要 npm run build 重新打包。
到此這篇關(guān)于詳解Vue項(xiàng)目的打包方式(生成dist文件)的文章就介紹到這了,更多相關(guān)Vue項(xiàng)目打包 內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
本文主要介紹了vue3+ts代理的使用，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-12-12
這篇文章主要介紹了ant-desigin-vue中form表單的使用解讀，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-07-07
這篇文章主要介紹了Vuex的初探與實(shí)戰(zhàn)小結(jié)，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-11-11
vue.js實(shí)現(xiàn)插入數(shù)值與表達(dá)式的方法分析
這篇文章主要介紹了vue.js實(shí)現(xiàn)插入數(shù)值與表達(dá)式的方法,結(jié)合實(shí)例形式分析了vue.js常見(jiàn)的3種插入數(shù)值實(shí)現(xiàn)方式,并總結(jié)了vue.js插值與表達(dá)式相關(guān)使用技巧,需要的朋友可以參考下2018-07-07
這篇文章主要介紹了Vue駝峰與短橫線分割命名中的注意事項(xiàng)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)吧2023-02-02
Element樹形控件整合帶圖標(biāo)的下拉菜單(tree+dropdown+input)
Element UI 官網(wǎng)提供的樹形控件包含基礎(chǔ)的、可選擇的、自定義節(jié)點(diǎn)內(nèi)容的、帶節(jié)點(diǎn)過(guò)濾的以及可拖拽節(jié)點(diǎn)的樹形結(jié)構(gòu)，本文實(shí)現(xiàn)了樹形控件整合帶圖標(biāo)的下拉菜單，感興趣的可以了解一下2021-07-07
vue中在echarts里設(shè)置的定時(shí)器清除不掉問(wèn)題及解決
這篇文章主要介紹了vue中在echarts里設(shè)置的定時(shí)器清除不掉問(wèn)題及解決方案，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-06-06
解決VUE的對(duì)話框el-dialog點(diǎn)擊外部消失問(wèn)題
這篇文章主要介紹了解決VUE的對(duì)話框el-dialog點(diǎn)擊外部消失問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-02-02
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)登錄類型切換，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-04-04
VuePress 由兩部分組成：一個(gè)以 Vue 驅(qū)動(dòng)的主題系統(tǒng)的簡(jiǎn)約靜態(tài)網(wǎng)站生成工具，和一個(gè)為編寫技術(shù)文檔而優(yōu)化的默認(rèn)主題。它是為了支持 Vue 子項(xiàng)目的文檔需求而創(chuàng)建的2019-11-11