webpack.DefinePlugin與cross-env區(qū)別詳解
webpack.DefinePlugin與cross-env常用于在項(xiàng)目工程化中定義環(huán)境變量,webpack.DefinePlugin用于在編譯期定義環(huán)境變量,意味著在代碼中寫上process.env.NODE_ENV不會(huì)在編譯期出現(xiàn)錯(cuò)誤提醒;cross-env庫(kù)用于在運(yùn)行時(shí)定義環(huán)境變量
DefinePlugin用來(lái)做定義。這就類似于我們項(xiàng)目開發(fā)中的config文件一樣,在config文件中一般放的是系統(tǒng)代碼中的一些服務(wù)器地址之類的公共信息,我們將這些信息提取出來(lái)單獨(dú)放在配置文件中,方便于后期的維護(hù)和管理。
// dev.env.js
module.exports = {
NODE_ENV: 'development'
}
// prod.env.js
module.exports = {
NODE_ENV: 'production'
}
// webpack配置
const env = require('../config/dev.env')
module.exports = {
entry: {},
output: {},
resolve: {
extensions: ['.js']
}
module: {},
plugins: [
new webpack.DefinePlugin({
'process.env': env.NODE_ENV
})
]
}
// package.json
{
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"build": "node build/build.js",
"build:development": "cross-env NODE_ENV=dev node build/build.js",
"build:test": "cross-env NODE_ENV=test node build/build.js",
"build:pre": "cross-env NODE_ENV=pre node build/build.js",
"build:prod": "cross-env NODE_ENV=prod node build/build.js"
}
}
到此這篇關(guān)于webpack.DefinePlugin與cross-env區(qū)別詳解的文章就介紹到這了,更多相關(guān)webpack.DefinePlugin與cross-env內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JS實(shí)現(xiàn)瀏覽器狀態(tài)欄顯示時(shí)間的方法
這篇文章主要介紹了JS實(shí)現(xiàn)瀏覽器狀態(tài)欄顯示時(shí)間的方法,涉及JavaScript針對(duì)時(shí)間及狀態(tài)欄操作的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-10-10
JavaScript純前端實(shí)現(xiàn)語(yǔ)音播報(bào)和朗讀功能
這篇文章主要為大家詳細(xì)介紹了JavaScript純前端實(shí)現(xiàn)語(yǔ)音播報(bào)和朗讀功能的相關(guān)知識(shí),文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-04-04
js實(shí)現(xiàn)iframe框架取值的方法(兼容IE,firefox,chrome等)
這篇文章主要介紹了js實(shí)現(xiàn)iframe框架取值的方法,可兼容IE,firefox,chrome等瀏覽器.涉及JavaScript針對(duì)框架元素取值的相關(guān)技巧,需要的朋友可以參考下2015-11-11
javascript控制swfObject應(yīng)用介紹
本文將詳細(xì)介紹js控制swfObject的實(shí)現(xiàn)方法,需要了解的朋友可以參考下2012-11-11
JS實(shí)現(xiàn)的走迷宮小游戲完整實(shí)例
這篇文章主要介紹了JS實(shí)現(xiàn)的走迷宮小游戲,涉及javascript鍵盤事件響應(yīng)及頁(yè)面元素動(dòng)態(tài)變換相關(guān)操作技巧,需要的朋友可以參考下2017-07-07
詳解處理bootstrap4不支持遠(yuǎn)程靜態(tài)框問題
這篇文章主要介紹了詳解處理bootstrap4不支持遠(yuǎn)程靜態(tài)框問題,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧2018-07-07
在html頁(yè)面上拖放移動(dòng)標(biāo)簽
在html頁(yè)面上拖放移動(dòng)標(biāo)簽,需要的朋友可以參考下。2010-01-01
前端面試運(yùn)行npm?run?xxx發(fā)生過程原理解析
這篇文章主要為大家介紹了前端面試運(yùn)行npm?run?xxx過程原理解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-07-07

