Setting environment variables correctly in Vue.js application The Next CEO of Stack Overflowbluemix serve onepage applicationHow to share a session between Vue.js dev and Rails 4 backend?Vue.js app deploymentnpm run build --mode [.env.mode] not working as expectedusing environment variables in vuejs applicationHow to overwrite environment variables in Vue-cli3?How to configure environment variables with vue-cli 3?Why Vue.js is not build to the production version?environment variables not visible in productionPass an argument (command line) to be used by an .env.[mode] file, during build in Vue.js
Why do professional authors make "consistency" mistakes? And how to avoid them?
Why is there a PLL in CPU?
Why doesn't a table tennis ball float on the surface? How do we calculate buoyancy here?
Is it my responsibility to learn a new technology in my own time my employer wants to implement?
How do I construct this japanese bowl?
Any way to transfer all permissions from one role to another?
How to start emacs in "nothing" mode (`fundamental-mode`)
How do I go from 300 unfinished/half written blog posts, to published posts?
What does "Its cash flow is deeply negative" mean?
What size rim is OK?
If the heap is initialized for security, then why is the stack uninitialized?
Return the Closest Prime Number
Would this house-rule that treats advantage as a +1 to the roll instead (and disadvantage as -1) and allows them to stack be balanced?
What is the purpose of the Evocation wizard's Potent Cantrip feature?
Is HostGator storing my password in plaintext?
Return of the Riley Riddles in Reverse
What is the point of a new vote on May's deal when the indicative votes suggest she will not win?
How to make a software documentation "officially" citable?
Is a stroke of luck acceptable after a series of unfavorable events?
What's the point of interval inversion?
How do we know the LHC results are robust?
Explicit solution of a Hamiltonian system
Only print output after finding pattern
How do I get the green key off the shelf in the Dobby level of Lego Harry Potter 2?
Setting environment variables correctly in Vue.js application
The Next CEO of Stack Overflowbluemix serve onepage applicationHow to share a session between Vue.js dev and Rails 4 backend?Vue.js app deploymentnpm run build --mode [.env.mode] not working as expectedusing environment variables in vuejs applicationHow to overwrite environment variables in Vue-cli3?How to configure environment variables with vue-cli 3?Why Vue.js is not build to the production version?environment variables not visible in productionPass an argument (command line) to be used by an .env.[mode] file, during build in Vue.js
So, I have the following two files in the root of my vue.js application:
.env.development:
NODE_ENV=development
VUE_WORDPRESS_API=LOCAL
.env.production:
NODE_ENV=production
VUE_WORDPRESS_API=PRODUCTION
I then have the following in my package.json:
"scripts":
"serve": "vue-cli-service serve --mode development",
"build": "vue-cli-service build --mode production",
,
So, I'm attempting to switch modes and therefore env variables depending on whether I am running $ rpm run serve or $ npm run build.
However, when running npm run serve, inside my application I am seeing that the environment variables aren't being set correctly:
// console.log(process.env.VUE_WORDPRESS_API) <= Undefined
if (process.env.VUE_WORDPRESS_API === 'PRODUCTION')
axios.defaults.baseURL = window.location.hostname
if (process.env.VUE_WORDPRESS_API === 'LOCAL')
axios.defaults.baseURL = process.env.VUE_WORDPRESS_API_LOCATION
I'm wondering, I must have something wrong with my env files? Are they named correctly? What am I missing?
vue.js vuejs2
asked Mar 8 at 12:40
Wind Up Lord VexxosWind Up Lord Vexxos
529
add a comment |
So, I have the following two files in the root of my vue.js application:
.env.development:
NODE_ENV=development
VUE_WORDPRESS_API=LOCAL
.env.production:
NODE_ENV=production
VUE_WORDPRESS_API=PRODUCTION
I then have the following in my package.json:
"scripts":
"serve": "vue-cli-service serve --mode development",
"build": "vue-cli-service build --mode production",
,
So, I'm attempting to switch modes and therefore env variables depending on whether I am running $ rpm run serve or $ npm run build.
However, when running npm run serve, inside my application I am seeing that the environment variables aren't being set correctly:
// console.log(process.env.VUE_WORDPRESS_API) <= Undefined
if (process.env.VUE_WORDPRESS_API === 'PRODUCTION')
axios.defaults.baseURL = window.location.hostname
if (process.env.VUE_WORDPRESS_API === 'LOCAL')
axios.defaults.baseURL = process.env.VUE_WORDPRESS_API_LOCATION
I'm wondering, I must have something wrong with my env files? Are they named correctly? What am I missing?
vue.js vuejs2
asked Mar 8 at 12:40
Wind Up Lord VexxosWind Up Lord Vexxos
529
Should it be.env.localinstead ofenv.local?
– ittus
Mar 8 at 12:45
@ittus Apologies, typo in my question - I have it as.env.[mode]in my source code...so that's not quite fixing things. (Have amended my question)
– Wind Up Lord Vexxos
Mar 8 at 12:46
process.env.VUE_WORDPRESS_API.LOCATIONis alwaysundefined?
– ittus
Mar 8 at 12:54
I would suggest you install and loadnpm install dotenv
– FirstIndex
Mar 8 at 13:00
3
@ittus Ahhhhh - here we go, the variables need to beVUE_APP_WORDPRESS_API_LOCATIONand notVUE_WORDPRESS_API_LOCATIOND'oh!
– Wind Up Lord Vexxos
Mar 8 at 13:46
add a comment |
So, I have the following two files in the root of my vue.js application:
.env.development:
NODE_ENV=development
VUE_WORDPRESS_API=LOCAL
.env.production:
NODE_ENV=production
VUE_WORDPRESS_API=PRODUCTION
I then have the following in my package.json:
"scripts":
"serve": "vue-cli-service serve --mode development",
"build": "vue-cli-service build --mode production",
,
So, I'm attempting to switch modes and therefore env variables depending on whether I am running $ rpm run serve or $ npm run build.
However, when running npm run serve, inside my application I am seeing that the environment variables aren't being set correctly:
// console.log(process.env.VUE_WORDPRESS_API) <= Undefined
if (process.env.VUE_WORDPRESS_API === 'PRODUCTION')
axios.defaults.baseURL = window.location.hostname
if (process.env.VUE_WORDPRESS_API === 'LOCAL')
axios.defaults.baseURL = process.env.VUE_WORDPRESS_API_LOCATION
I'm wondering, I must have something wrong with my env files? Are they named correctly? What am I missing?
vue.js vuejs2
asked Mar 8 at 12:40
Wind Up Lord VexxosWind Up Lord Vexxos
529
So, I have the following two files in the root of my vue.js application:
.env.development:
NODE_ENV=development
VUE_WORDPRESS_API=LOCAL
.env.production:
NODE_ENV=production
VUE_WORDPRESS_API=PRODUCTION
I then have the following in my package.json:
"scripts":
"serve": "vue-cli-service serve --mode development",
"build": "vue-cli-service build --mode production",
,
So, I'm attempting to switch modes and therefore env variables depending on whether I am running $ rpm run serve or $ npm run build.
However, when running npm run serve, inside my application I am seeing that the environment variables aren't being set correctly:
// console.log(process.env.VUE_WORDPRESS_API) <= Undefined
if (process.env.VUE_WORDPRESS_API === 'PRODUCTION')
axios.defaults.baseURL = window.location.hostname
if (process.env.VUE_WORDPRESS_API === 'LOCAL')
axios.defaults.baseURL = process.env.VUE_WORDPRESS_API_LOCATION
I'm wondering, I must have something wrong with my env files? Are they named correctly? What am I missing?
vue.js vuejs2
vue.js vuejs2
asked Mar 8 at 12:40
Wind Up Lord VexxosWind Up Lord Vexxos
529
asked Mar 8 at 12:40
Wind Up Lord VexxosWind Up Lord Vexxos
529
edited Mar 8 at 13:46
Wind Up Lord Vexxos
asked Mar 8 at 12:40
Wind Up Lord VexxosWind Up Lord Vexxos
529
asked Mar 8 at 12:40
Wind Up Lord VexxosWind Up Lord Vexxos
529
asked Mar 8 at 12:40
Wind Up Lord VexxosWind Up Lord Vexxos
529
529
Should it be.env.localinstead ofenv.local?
– ittus
Mar 8 at 12:45
@ittus Apologies, typo in my question - I have it as.env.[mode]in my source code...so that's not quite fixing things. (Have amended my question)
– Wind Up Lord Vexxos
Mar 8 at 12:46
process.env.VUE_WORDPRESS_API.LOCATIONis alwaysundefined?
– ittus
Mar 8 at 12:54
I would suggest you install and loadnpm install dotenv
– FirstIndex
Mar 8 at 13:00
3
@ittus Ahhhhh - here we go, the variables need to beVUE_APP_WORDPRESS_API_LOCATIONand notVUE_WORDPRESS_API_LOCATIOND'oh!
– Wind Up Lord Vexxos
Mar 8 at 13:46
add a comment |
Should it be.env.localinstead ofenv.local?
– ittus
Mar 8 at 12:45
@ittus Apologies, typo in my question - I have it as.env.[mode]in my source code...so that's not quite fixing things. (Have amended my question)
– Wind Up Lord Vexxos
Mar 8 at 12:46
process.env.VUE_WORDPRESS_API.LOCATIONis alwaysundefined?
– ittus
Mar 8 at 12:54
I would suggest you install and loadnpm install dotenv
– FirstIndex
Mar 8 at 13:00
3
@ittus Ahhhhh - here we go, the variables need to beVUE_APP_WORDPRESS_API_LOCATIONand notVUE_WORDPRESS_API_LOCATIOND'oh!
– Wind Up Lord Vexxos
Mar 8 at 13:46
Should it be
.env.local instead of env.local?– ittus
Mar 8 at 12:45
Should it be
.env.local instead of env.local?– ittus
Mar 8 at 12:45
@ittus Apologies, typo in my question - I have it as
.env.[mode] in my source code...so that's not quite fixing things. (Have amended my question)– Wind Up Lord Vexxos
Mar 8 at 12:46
@ittus Apologies, typo in my question - I have it as
.env.[mode] in my source code...so that's not quite fixing things. (Have amended my question)– Wind Up Lord Vexxos
Mar 8 at 12:46
process.env.VUE_WORDPRESS_API.LOCATION is always undefined?– ittus
Mar 8 at 12:54
process.env.VUE_WORDPRESS_API.LOCATION is always undefined?– ittus
Mar 8 at 12:54
I would suggest you install and load
npm install dotenv– FirstIndex
Mar 8 at 13:00
I would suggest you install and load
npm install dotenv– FirstIndex
Mar 8 at 13:00
3
3
@ittus Ahhhhh - here we go, the variables need to be
VUE_APP_WORDPRESS_API_LOCATION and not VUE_WORDPRESS_API_LOCATION D'oh!– Wind Up Lord Vexxos
Mar 8 at 13:46
@ittus Ahhhhh - here we go, the variables need to be
VUE_APP_WORDPRESS_API_LOCATION and not VUE_WORDPRESS_API_LOCATION D'oh!– Wind Up Lord Vexxos
Mar 8 at 13:46
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55063458%2fsetting-environment-variables-correctly-in-vue-js-application%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55063458%2fsetting-environment-variables-correctly-in-vue-js-application%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Should it be
.env.localinstead ofenv.local?– ittus
Mar 8 at 12:45
@ittus Apologies, typo in my question - I have it as
.env.[mode]in my source code...so that's not quite fixing things. (Have amended my question)– Wind Up Lord Vexxos
Mar 8 at 12:46
process.env.VUE_WORDPRESS_API.LOCATIONis alwaysundefined?– ittus
Mar 8 at 12:54
I would suggest you install and load
npm install dotenv– FirstIndex
Mar 8 at 13:00
3
@ittus Ahhhhh - here we go, the variables need to be
VUE_APP_WORDPRESS_API_LOCATIONand notVUE_WORDPRESS_API_LOCATIOND'oh!– Wind Up Lord Vexxos
Mar 8 at 13:46