欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

.env在mode文件中如何添加注釋詳解

 更新時間:2022年09月22日 11:00:58   作者:甜點cc  
這篇文章主要為大家介紹了.env在mode文件中如何添加注釋詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪

前言

Vue-Cli 允許我們在項目根目錄創(chuàng)建.env.[mode]文件來設(shè)置一些打包編譯的啟動參數(shù),通過執(zhí)行腳本的時候加mode參數(shù),指定不同環(huán)境需要加載的配置文件

形如: .env.test

NODE_ENV='production'
VUE_APP_PATH='./'
VUE_APP_RUNTIME='prod'

問題

怎么在 .env.test 文件中添加注釋呢?

分析

這要看vue是怎么解析 .env.test 文件的

通過啟動腳本,一路找到了處理 .env.test 文件的邏輯,讓我們一塊看下

path:node_modules\@vue\cli-service\lib\Service.js

const dotenv = require('dotenv');
// ...
loadEnv (mode) {
    const logger = debug('vue:env')
    const basePath = path.resolve(this.context, `.env${mode ? `.${mode}` : ``}`)
    const localPath = `${basePath}.local`
    const load = envPath => {
      try {
        const env = dotenv.config({ path: envPath, debug: process.env.DEBUG })
        dotenvExpand(env)
        logger(envPath, env)
      } catch (err) {
        // only ignore error if file is not found
        if (err.toString().indexOf('ENOENT') < 0) {
          error(err)
        }
      }
    }
    load(localPath)
    load(basePath)
    // by default, NODE_ENV and BABEL_ENV are set to "development" unless mode
    // is production or test. However the value in .env files will take higher
    // priority.
    if (mode) {
      // always set NODE_ENV during tests
      // as that is necessary for tests to not be affected by each other
      const shouldForceDefaultEnv = (
        process.env.VUE_CLI_TEST &&
        !process.env.VUE_CLI_TEST_TESTING_ENV
      )
      const defaultNodeEnv = (mode === 'production' || mode === 'test')
        ? mode
        : 'development'
      if (shouldForceDefaultEnv || process.env.NODE_ENV == null) {
        process.env.NODE_ENV = defaultNodeEnv
      }
      if (shouldForceDefaultEnv || process.env.BABEL_ENV == null) {
        process.env.BABEL_ENV = defaultNodeEnv
      }
    }
  }

從上面的代碼,可以得知,vue使用dotenv解析 .env.test 文件,并將環(huán)境變量從 .env[mode] 文件中加載到 process.env 環(huán)境變量中

解決(dotenv)

dotenv插件已經(jīng)被 Vue-Cli 集成了

GitHub地址

README.md 中有這么一段話:

# marks the beginning of a comment (unless when the value is wrapped in quotes)

這就是我們要找的,在.env.[mode] 文件中,可以使用 # 進行注釋

使用測試

  • path: .env.prod 參數(shù)配置
NODE_ENV='production'
# VUE_APP_PATH='/pc/'
VUE_APP_PATH='./'
VUE_APP_RUNTIME='prod'
  • package.json 文件腳本命令配置--mode參數(shù)
"scripts": {
    "build": "vue-cli-service build --mode prod",
  },
  • 執(zhí)行 npm run build 命令,輸出如下:

NODE_ENV=== production
VUE_APP_PATH=== ./

以上就是.env在mode文件中如何添加注釋詳解的詳細(xì)內(nèi)容,更多關(guān)于.env在mode文件添加注釋的資料請關(guān)注腳本之家其它相關(guān)文章!

相關(guān)文章

  • Vue報錯:TypeError:Cannot create property 'xxx' on string 'xxxx'問題

    Vue報錯:TypeError:Cannot create property '

    這篇文章主要介紹了Vue報錯:TypeError:Cannot create property 'xxx' on string 'xxxx'問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
    2024-08-08
  • vue-cropper實現(xiàn)裁剪圖片

    vue-cropper實現(xiàn)裁剪圖片

    這篇文章主要為大家詳細(xì)介紹了vue-cropper實現(xiàn)裁剪圖片,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2022-05-05
  • Vue+Jwt+SpringBoot+Ldap完成登錄認(rèn)證的示例代碼

    Vue+Jwt+SpringBoot+Ldap完成登錄認(rèn)證的示例代碼

    本篇文章主要介紹了Vue+Jwt+SpringBoot+Ldap完成登錄認(rèn)證的示例代碼,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2018-05-05
  • 如何在vue里添加好看的lottie動畫

    如何在vue里添加好看的lottie動畫

    這篇文章主要介紹了在vue里添加好看的lottie動畫效果的方法,在vue中引入lottie非常簡單,需要的朋友可以參考下
    2018-08-08
  • Vue3 響應(yīng)式數(shù)據(jù) reactive使用方法

    Vue3 響應(yīng)式數(shù)據(jù) reactive使用方法

    這篇文章主要介紹了Vue3 響應(yīng)式數(shù)據(jù) reactive使用方法,本文通過實例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下
    2023-11-11
  • vue中使用帶隱藏文本信息的圖片、圖片水印的方法

    vue中使用帶隱藏文本信息的圖片、圖片水印的方法

    這篇文章主要介紹了vue中使用帶隱藏文本信息的圖片、圖片水印的方法,本文通過實例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下
    2020-04-04
  • vue3使用svg圖標(biāo)的方式總結(jié)

    vue3使用svg圖標(biāo)的方式總結(jié)

    在Vue?3中,可以使用多種方式來使用SVG圖標(biāo),這篇文章主要為大家總結(jié)了五個常用的方式,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以了解下
    2023-08-08
  • vue中mint-ui環(huán)境搭建詳細(xì)介紹

    vue中mint-ui環(huán)境搭建詳細(xì)介紹

    這篇文章主要介紹了vue中mint-ui環(huán)境搭建詳細(xì)介紹的相關(guān)資料,需要的朋友可以參考下
    2017-04-04
  • Vue項目中如何配置src文件下的@別名

    Vue項目中如何配置src文件下的@別名

    這篇文章主要介紹了Vue項目中如何配置src文件下的@別名問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
    2024-03-03
  • vue開發(fā)中關(guān)于axios的封裝過程

    vue開發(fā)中關(guān)于axios的封裝過程

    這篇文章主要介紹了vue開發(fā)中關(guān)于axios的封裝過程,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教
    2022-08-08

最新評論