i try to use environment variables in vue-cli, but is not working, everytime says 'undefined' when use console.log(process.env.VUE_APP_BASE_URI)
. But process.env.NODE_ENV
says 'development' as i defined in webpack.config.js.
I read the documentation of vue-cli 3 and put my .env.* files in the root project. like this:
Webpack.config.js
module.exports = {
mode: 'development',
context: __dirname,
entry: {
main: ['babel-polyfill', './App/index.js']
},
plugins:[
new VueLoaderPlugin()
],
.env.development
VUE_APP_BASE_URI=http://localhost:64208/api/
.env.production
VUE_APP_BASE_URI=http://localhost:64208/api/
I use .NET Core with Vue. How to use the environment?
Vue CLI is now in maintenance mode. For new projects, please use create-vue to scaffold Vite-based projects. create-vue supports both Vue 2 and Vue 3.
Environment Variables Vue CLI keeps track of the mode you have instructed it to build your project in. As a part of the build process, it will look for a file in the project root called.env. [BUILD-MODE-NAME] and load in only the file that matches.
By default, Vue CLI will support three modes: “development”, “test’, and "production”. For more information on using environment variables with Vue CLI 3, consult the official documentation.
Things like usernames, password, links to an api, and more should not be stored directly. Storing them in environment variables is one of the easiest ways keep them private and have our code still access these important strings. The way Vue CLI 3 accesses environment variables is different from version 2.
The Vue team created the Vue Command Line Interface (CLI) to help us quickly set up new projects in a complete development environment, including a local server. When we run a local webpage from our system, the browser uses the file:// protocol to render that page. But Vue uses some modern Javascript features that only work on the http:// protocol.
it just happened to me, the solution is very simple. Just restart your development server.
ctrl + c
then
npm run serve
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With