Fatal编程技术网
  • javascript/
  • Javascript dev.env.js中定义的密钥无法通过vuejs中的webpack访问

Javascript dev.env.js中定义的密钥无法通过vuejs中的webpack访问

javascript node.js webpack vue.js

Javascript dev.env.js中定义的密钥无法通过vuejs中的webpack访问,javascript,node.js,webpack,vue.js,environment-variables,Javascript,Node.js,Webpack,Vue.js,Environment Variables,该模板基于vuejs webpack，构建、配置文件是，我没有修改任何这些文件 根据dev.env.js文件中定义的键，在应用程序中运行npm run dev时必须可以访问该文件 这是我的dev.env.js的内容： 'use strict' const merge = require('webpack-merge') const prodEnv = require('./prod.env') module.exports = merge(prodEnv, { NODE_ENV: '"de

该模板基于vuejs webpack，构建、配置文件是，我没有修改任何这些文件

根据
dev.env.js
文件中定义的键，在应用程序中运行
npm run dev
时必须可以访问该文件

这是我的
dev.env.js
的内容：

'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',
  SAMPLE: '"XX"',
  AUTH_URL: '"http://localhost:3030"'
})
当我尝试像这样访问
App.vue
中的
AUTH\u URL
时，我会收到
未定义的


在我看来，
dev.env.js
文件中定义的任何内容在运行
npm run dev
时都将永远无法访问。请使用
webpack.DefinePlugin
定义希望与前端共享的变量。网页包本身不向浏览器公开
进程
，因为这是一个
节点js函数


const dev_env = require('dev.env.js)

plugins: [
  new webpack.DefinePlugin({
    'process.env' : {
      NODE_ENV: JSON.stringify(dev_env.NODE_ENV)
    }
  })
]



上面的一些变体应该适合您。
如果您运行的是“npm run dev”，那么您的新环境变量只有在重新启动npm（Ctrl+C，再次是“npm run dev”）后才可用。
Hi@ohgodhy这仅在vue组件中有效，但手动导入的其他js文件无法访问它。但我如何才能做到这一点呢？@Photonic Webpack不负责其他文件。每当您在webpack中有这样的变量时，它们都会给它们起别名，所以这些变量对您来说是全局不可用的。考虑外部需要jQuery。