1. 程式人生 > 程式設計 >vue cli3 實現分環境打包的步驟

vue cli3 實現分環境打包的步驟

用cli3搭建的vue專案號稱零配置檔案,為了方便打包(不用手動來回改不同環境進行打包)那麼我們在需要打包的時候分不同環境打包怎麼辦呢
1.在根目錄下建立三個配置檔案,如下圖

在這裡插入圖片描述

這裡我建立了三個,這三個分別是我的 本地;離程式設計客棧線;線上環境 ,三個檔案的內容依次為下VUE_APP_TITLE要對應當程式設計客棧前檔案字尾,build 對應的production

NODE_ENV = 'production'
VUwww.cppcns.comE_APP_TITLE = 'alpha'
=======================http://www.cppcns.com=============================================
NODE_ENV = 'production'
VUE_APP_TITLE = 'production'
====================================================================
NODE_ENV = 'production'
VUE_APP_TITLE = 'online'

2.package.json配置對應環境打包名稱,如圖所示:

在這裡插入圖片描述

3.如圖所示

在這裡插入圖片描述

4.在介面攔截檔案,如圖所示:

在這裡插入圖片描述

5.配置完以後三個環境打打包方式分別如下:
app打包離線環境:npm run alpha
app打包本地環境:npm run build
app打包正式環境:npm run online

到此這篇關於vwNmYAyue cli3 實現分環境打包的步驟的文章就介紹到這了,更多相關vue cli3 分環境打包內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!