webpack(process.env.NODE_ENV)build打包自動區分環境

webpack每次打包都要切換地址(很煩)

前端項目在每次打包的時候都要求切換後臺地址,如果有哪次忘記了切換地址就打包的,發到線上就報錯了,又要修改地址後再打包。雖然這不是什麼難事,就花費時間而已,但是作爲一名合格的碼農,就是要遵循偷懶原則,所以我們要做一個判斷處理。

process.env.NODE_ENV

對,就是它process.env.NODE_ENV,如果你不認識它,沒關係,小生給你一個地址:

https://www.cnblogs.com/tugenhua0707/p/9780621.html

如果你有耐心看完,那你一定會了解process.env.NODE_ENV是幹什麼的,但是如果你還是要碼農偷懶原則,那我就告訴來告訴你把。process.env.NODE_ENV 是用來辨識開發環境的,如果 process.env.NODE_ENV === 'development' 則說明是開發環境,你需要是是開發環境的後臺地址。

所以,接下來就要知道怎麼判斷了吧!

/**
 * 全局配置文件env.js
 */
let baseURL;
if(process.env.NODE_ENV === 'development'){  
  baseURL = 'http://192.168.0.138:8000';  //此處填寫你的開發地址     
}else{
  baseURL = window.location.origin         //此處自動獲取地址欄域名地址   
}
export default {baseURL}

你先建立一個全局的配置文件,然後在你需要的地方引入就好了

import { baseUrl } from './env'
console.log( baseUrl )

這樣就大功告成了,webpack 打包就直接 

npm run build

希望讀者可以看明白了,最後想詳細瞭解process.env.NODE_ENV,你可以訪問:

https://www.jianshu.com/p/75b429e2c84b

https://www.jianshu.com/p/c8f9c61c2f20

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章