I am using nuxt 2.5.1 and want to log some messages by debug. I tried start up the project by "DEBUG=* nuxt" and tons of debug messages flooding in, so I expect the setup is OK.
But when I try showing my custom messages in a project file, the debug messages never show up.
I start the app by 'npm run dev-debug'.
package.json
"scripts": {
"dev": "nuxt",
"dev-debug": "DEBUG=app nuxt",
"build": "nuxt build",
"start": "nuxt start",
"generate": "nuxt generate",
"lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
"precommit": "npm run lint"
},
middleware/api/staffDuties.js
const axios = require('axios')
const debug = require('debug')('app')
export default function() {
debug('Hello')
axios({
url: 'http://localhost:3010/staffDuties',
method: 'get'
}) // do stuff...
debug('succeed')
}
The staffDuties.js is placed inside the middleware folder and is mapped to the index.vue. I use json-server to mock an API endpoint, from the run log of json-server I can confirm the function is indeed executed.
Can anyone give me some advice?
Related
I have a React app, which has a public folder. Inside it, I have a Webworker.js file which contains code that I have written.
As it is inside public, it is served as is. I would like the code to be lightly minified, i.e. remove any whitespace, comments, simplify variable names, etc. I would like to add this as a deployment hook so that when I build my app it is automatically minified in the build. How can I do this?
My current script setup is:
"scripts": {
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
"start": "react-scripts start",
"build": "GENERATE_SOURCEMAP=false react-scripts build",
}
I want to see any updates i make to my code reflected in the browser. In VSC terminal I run "npm run dev". If i make changes to the code nothing happens unless i CTRL + C and run "npm run dev" again.
I have tried running it in Chrome (instead of Brave)
I have tried:
npm run build
npm start
I have tried:
"scripts": {
"test": "jest",
"dev": " next dev -p 8000",
"build": "next build",
"start": "next start",
}
I have tried:
"scripts": {
"test": "jest",
"dev": " next dev -p 8888",
"build": "next build",
"start": "next start",
}
im wondering if it has to do with the way ive organized my project
below is my project's directory organization:
v components
v web3
Connected.js
NotConncted.js
Web3Button.js
DashboardSidebar.js
>node_modules
>pages
>api
_app.js
index.js
...etc
I have two different environments with named .env.development, .env.production, and common .env also.
.env.development looks like this,
TEST_LABEL=Development
.env.production looks like this,
TEST_LABEL=Production
.env looks like this,
TEST_LABEL=ENV
And here is my babel.config.js,
module.exports = function (api) {
api.cache(true);
return {
presets: ['module:metro-react-native-babel-preset'],
plugins: [
["module:react-native-dotenv",
{
"moduleName": "#env"
},]
]
};
};
this is the scripts in package.json
"scripts": {
"start": "react-native start",
"development": "NODE_ENV=development expo start",
"production": "NODE_ENV=production expo start",
"android": "react-native run-android",
"ios": "react-native run-ios",
"web": "expo start --web",
"eject": "expo eject",
"test": "jest"
},
And this is how I used it in my Homescreen.js
import {TEST_LABEL} from "#env"
...
<Text>{TEST_LABEL}</Text>
And this displays always Development even I run the production env
I run the app like npm run development for development environment, npm run production for production environment.
I am using react-native-dotenv
Here is the Project structure snapshot,
I found this issue and it says the only supported envs are development, production, and test. If you want to use other env names you can use the experimental feature APP_ENV
"demo": "APP_ENV=demo expo start",
"local": "APP_ENV=local expo start",
and I think .local files are loaded by default
UDPATE
I tested your config and it looks like this issue is the reason the value is not updating, adding -c to your commands clears the cache and load the correct env values
"development": "NODE_ENV=development expo start -c",
"production": "NODE_ENV=production expo start -c",
App is consist of Node.js and React. There is no database. Heroku local web works fine but deployment doesn't work properly. Deployment just has index.html. In short words, node and react doesn't work properly on deployment.
backend package.json
"engines": {
"node": "15.4.0",
"npm": "7.20.5"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node app.js",
"heroku-postbuild": "cd frontend && npm install && npm run build"
}
frontend package.json
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"proxy": "http://localhost:5000"
app.js
app.use(express.static(path.join(__dirname, './frontend/build')));
app.get('*', (req, res) => {
res.sendFile(path.join(__dirname+'/frontend/build/index.html'));
});
const PORT = process.env.PORT || 5000;
Procfile
web: node app.js
Everything is fine with the heroku local web code as above. But on deployment I met error like this:
error I got
Stopping all processes with SIGTERM
heroku[web.1]: Process exited with status 143
I tried some solutions in here. But I couldn't solve.
I can write more information as needed. Thanks!
Add these to your frontend package.json scripts :
"devStart": "react-scripts start",
"start": "serve -s build",
....
"heroku-postbuild": "npm run build"
I have deployed my simple React app to Heroku - https://projectslist.herokuapp.com It works just fine except for the server part which doesn't work at all. I've seen the logs and it says that my only server method - /sendmail - returns error 404. How can i fix this problem? I suppose that I should edit something in package.json file but I'm not sure what I should change.
Here's my github repo - https://github.com/VasVV/Projects-list
Try putting your server files in the root directory folder and everything else in a client folder within the root:
1.) Put your server.js into the root directory
2.) Add these commands to your root package.json...
"scripts": {
"client-install": "npm install --prefix client",
"start": "node server.js",
"server": "nodemon server.js",
"client": "npm start --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client"
},
"proxy": "http://localhost:4242/"
3.) Create a client folder and put your src and public folders in it.
4.) Add these commands to your client folders package.json...
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
Your file structure from root should look like this:
Root
client
Public
Src
package.json
server.js
package.json
5.) Move all your server-related stuff into the root folder, that way, you don't have to cd into any nested folders.
Add a Procfile to your root folder that says something like:
web: node server/index.js -port 8000
And a small addition to the scripts part of your package.json that tells Heroku that once it's fetched all the dependencies for your project it should build it, although that may not be necessary now.
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"heroku-postbuild": "npm run build"
},