I have created .env file to set environment variables as shown below:
Inside which I have given below mentioned code.
VUE_APP_BASEURL="https://qa-apps-nodejs.Dtech.com:9000/"
PORT=8080
I have written below code in my js file and executed npm install dotenv:
require('dotenv').config();
console.log(process.env.VUE_APP_BASEURL);
With the above code, I need to get https://qa-apps-nodejs.Dtech.com:9000/ in console. But instead I'm getting:
undefined
Just restart your server as newly created env variables are not available only after hot-reload you have to rebuild your application (restart your server). For reference you can look here
No need to install "dotenv" simply place .env file in the root of your project (at the same level of your package.json file) and Vue CLI will handle the reset. Side note; as of Vue CLI 3 only variables that start with VUE_APP_ will be loaded. make sure also to rerun npm run serve again to restart your server.
for more details: visit docs
Related
I've got installed Cypress on my Vue project and created just a few simple tests that perform great when I run Cypress with this command npx cypress open.
I am trying to implement automatisation with the help of Lambdatest but when I run command lambdatest-cypress run I receive this message in return:
Checking Lambda Config in current directory
Validating CLI
validating config
Error!! Cypress Config File does not exist
I have installed Lambdatest cli globally, added lambdatest-config.json in the root of my project, and updated "lambdatest_auth" data in this file. Also I've got cypress.config.js on the same root level in project's directory. Cypress's config file does not show any errors excluding eslint saying that
on this part
setupNodeEvents(on, config) {
// implement node event listeners here
},
on and config are declared but never used.
Do you have any ideas why I can not run this one using Lambdatest?
As always maybe someone will find it useful.
So... it would seem that in some cases lambdatest get's a little bit lost and it's config is not filled with the things it should be :)
The solution was to remove this line of code in lambdatest-config.json file which is located in the project root directory.
"cypress_config_file": "cypress.config.js", <-- remove this line
I am creating an app to work with an API using serverless, and the initial install was ok. One of the folders that the npm serverless install does is auth-server, where two files - handler.js and serverless.yml are created (other than the .gitignore).
A few steps later, I had to install Axios as I will need to make a POST request for the API. Being on the auth-server directory, I ran the usual npm syntax to install Axios, npm install axios. To my surprise, however, npm has not created the package.json (and package-lock.json) file within the auth-server folder but used the root files.
I tried to look around to see if the problem was recurrent, but found nothing. I know that package-json file is created within the directory folder from where npm is executed as I have used axios a few times. Can someone point me where the problem may lie? Thanks in advance.
In case someone else needs this: I found out that although not in all cases, it is not uncommon that the npm will use the package.json file of the root folder. As I needed it inside the auth-server folder, I simply created another package.json file inside it (with a pair of curly brackets on it to avoid a parse error code EJSONPARSE) and saved it. Once I installed Axios one more (npm install axios) the package.json file began to be used and added Axios as a dependency.
I am new to vue in general and i am trying to configure some environment variables for some projects of mine so i can do some tests with cookies but apperently i ran the simple webpack configurations when creating these projects, therefore i dont have access to the config directory to edit said variables.
I created a vue.config.js file and used the following lines:
module.exports = {
publicPath: 'myAppName'
}
However if i run it on development mode, or simply use npm run serve my app runs at "http://localhost:8080/myAppName" instead of simply "myAppName".
How do i correctly configure my environment variables for my projects without having to start over from scratch? I am using vueCli 3 btw.
I tried following these examples but none have worked:
Using Environment Variables with Vue.js
I also have .env file and a .env.development file but i am not sure what to add to it.
I'm using the latest vue-cli version 3.0.
My current issue is that whenever I run npm run build the files generated in the dist folder can't be run without a server.
I would like to be able to just open the index.html file on the browser. How do I go about doing this?
I ran into a similar issue and the following two changes helped me to make it work. Now I can just open index.html in Chrome as a file to run my SPA from file system.
In vue.config.js, I did not have a publicPath configured, which resulted in the default "/".
I had to configure it to empty string like this so that it uses relative paths:
module.exports = {
publicPath: '',
}
PS: Since Vue CLI 3.3 use publicPath instead of the now deprecated baseURL
I was using the history mode of vue-router, which does not work
on a local file system to route the paths back to index.html. So I
omitted the mode to go back to the default hash mode.
I was able to fix this issue by manually changing the url of the referenced files.
It's a bit of a pain, but this was a solution without having to mess around with the build configuration.
What you need to do:
Open index.html
Find href=/ and replace with href=
Find src=/ and replace with src=
NOTE: I was in need of this solution because I was creating a Phonegap app.
You can use the http-server module
npm install http-server -g
http-server dist/
normally the server starts at port 8080 so you can serve the build app on http://localhost:8080
What I do :
1.I used the opencv-plugin-sample(from the link https://github.com/Kurento/kms-opencv-plugin-sample) and start the kuretoMediaServer
2.In the client side I used js and java,Both works well
3.For js I used the command
cmake .. -DGENERATE_JS_CLIENT_PROJECT=TRUE
npm install grunt grunt-browserify grunt-contrib-clean grunt-jsdoc grunt-npm2bower-sync minifyify
grunt
to generate the js folder and the dist folder
4.For java I used the command
cmake .. -DGENERATE_JAVA_CLIENT_PROJECT=TRUE
make java_install
What I have to do:
1.Now I need to run kurento with android,So I have used the following link https://github.com/apeunit/AppRTC-Kurento-Example
2.In the client side they have used node-js to communicate with KMS
3.Now I am trying to add the opencv sample in the existing code,With reference to the link http://doc-kurento.readthedocs.org/en/stable/mastering/develop_kurento_modules.html#examples ,I changed the package.json file but it shows the error
'kurento-module-opencvpluginsample' is not in the npm registry.
4.When I checked the crowd-detector sample(https://github.com/Kurento/kurento-tutorial-node/tree/master/kurento-crowddetector ) ,module(kurento-module-crowddetector) is present in the node_module folder,For the opencv-sample
Whether I need to add the module(kurento-module-opencvpluginsample) maually?or
Is there any default steps to generate files in the module(kurento-module-opencvpluginsample) folder as done in java and js above?
npm resolves packages by name and version by checking with the npm registry (see this link for more info) What this line
kurento-module-opencvpluginsample' is not in the npm registry.
is telling you, is that it cannot find your module in the npm registry. That's no surprise, as it is only located in your local machine. Please have a look at this SO answer about how to specify local modules as npm deps.