访问process.env可以在很多方面为您提供帮助：

• 根据Quasar模式 (SPA/PWA/Cordova/Electron)区分运行时程序
• 根据运行开发或生产构建，区分运行时程序
• 在构建时根据终端环境变量向其添加标志

Quasar CLI提供的值

例子

if (process.env.DEV) {
  console.log(`I'm on a development build`)
}

// process.env.MODE is the <mode> in
// "quasar dev/build -m <mode>"
// (defaults to 'spa' if -m parameter is not specified)
if (process.env.MODE === 'electron') {
  const { remote } = require('electron')
  const win = remote.BrowserWindow.getFocusedWindow()

  if (win.isMaximized()) {
    win.unmaximize()
  }
  else {
    win.maximize()
  }
}

剥离代码

在编译您的网站/应用程序时，会根据process.env评估if()分支，如果表达式为“false”，则会将其从文件中删除。 例：

if (process.env.DEV) {
  console.log('dev')
}
else {
  console.log('build')
}

// running with "quasar dev" will result in:
console.log('dev')
// while running with "quasar build" will result in:
console.log('build')

请注意上面的if在编译时被评估并完全剥离，导致更小的包。

基于process.env导入

您可以将上面学到的内容与动态导入结合起来：

if (process.env.MODE === 'electron') {
  import('my-fancy-npm-package').then(package => {
    // notice "default" below, which is the prop with which
    // you can access what your npm imported package exports
    package.default.doSomething()
  })
}

添加到process.env

@quasar/app v2 specs

您可以通过/ quasar.conf.js文件将自己的定义添加到process.env：

// quasar.conf.js

build: {
  env: {
    API: ctx.dev
      ? 'https://dev.api.com'
      : 'https://prod.api.com'
  }
}

然后在您的网站/应用程序中，您可以访问process.env.API，它将指向上面的两个链接之一，基于开发或生产构建类型。

你甚至可以更进一步。 提供来自quasar dev/build环境变量的值：

# we set an env variable in terminal
$ MY_API=api.com quasar build

// then we pick it up in /quasar.conf.js
build: {
  env: {
    API: ctx.dev
      ? 'https://dev.' + process.env.MY_API
      : 'https://prod.' + process.env.MY_API
  }
}