babel-node not recognized while running heroku local web - node.js

I tried deploying Node.js API on Heroku, but shows Application Error.
So, used the "heroku local web" command to test any error..and got an error saying that 'babel-node' is not recognized as an internal or external command, operable program or batch file.
On the other hand, when I run the command 'npm start' I dont get any error and the server starts running.
package.json
{
"name": "apollo-starter-kit",
"version": "0.1.0",
"description": "Minimal set of code to write a GraphQL server with Apollo graphql-tools",
"scripts": {
"start": "nodemon ./server.js --exec babel-node",
"test": "echo \"Error: no test specified\" && exit 1",
"lint": "eslint ."
},
"repository": {
"type": "git",
"url": "git+https://github.com/apollostack/apollo-starter-kit.git"
},
"keywords": [
"Node.js",
"Javascript",
"GraphQL",
"Express",
"Apollo",
"Meteor"
],
"author": "Jonas Helfer <jonas#helfer.email>",
"license": "MIT",
"bugs": {
"url": "https://github.com/apollostack/apollo-starter-kit/issues"
},
"homepage": "https://github.com/apollostack/apollo-starter-kit#readme",
"dependencies": {
"apollo-server": "^0.1.2",
"casual": "^1.5.10",
"cors": "^2.8.1",
"express": "^4.13.4",
"lodash": "^4.17.4",
"mongoose": "^4.8.1",
"sequelize": "^3.30.2",
"sqlite": "^2.3.0"
},
"devDependencies": {
"babel-cli": "6.5.1",
"babel-core": "^6.5.2",
"babel-eslint": "^6.0.0-beta.6",
"babel-loader": "6.2.3",
"babel-plugin-inline-import": "^2.0.1",
"babel-polyfill": "6.5.0",
"babel-preset-es2015": "6.5.0",
"babel-preset-react": "^6.5.0",
"babel-preset-stage-0": "6.5.0",
"casual": "^1.5.10",
"eslint": "^2.4.0",
"eslint-config-airbnb": "^6.1.0",
"eslint-plugin-import": "^1.1.0",
"eslint-plugin-react": "^4.2.3",
"graphql": "^0.6.0",
"nodemon": "^1.9.1"
},
"peerDependencies": {
"graphql": "^0.5.0 || ^0.6.0"
},
"eslintConfig": {
"parser": "babel-eslint",
"extends": [
"airbnb/base",
"plugin:import/errors"
],
"rules": {
"no-use-before-define": 0,
"arrow-body-style": 0,
"dot-notation": 0,
"no-console": 0
},
"env": {
"mocha": true
}
}
}

I think the most likely cause is that babel is part of dev dependencies and those are not installed by default via official node.js buildpack. Change NPM_CONFIG_PRODUCTION to false and it should work.
You can use command line
heroku config:set NPM_CONFIG_PRODUCTION=false
You can always login into Heroku dyno to check if everything is installed properly
heroku run bash

You should not be using babel-node in production. It is unnecessarily heavy, with high memory usage due to the cache being stored in memory. You will also always experience a startup performance penalty as the entire app needs to be compiled on the fly.
ref: https://medium.com/#Cuadraman/how-to-use-babel-for-production-5b95e7323c2f

Related

After Svelte/Sapper app delopy on Heroku 404 The requested page could not be found

I have a Svelte app deployed to Heroku. This is a legacy code, at first I had 500 error, but after I installed serve the 500 error is gone, but I get the abovementioned 404. I have created another folder on my computer and pulled this very app from Heroku with heroku git:clone -a , ran npm install and it works like a charm locally. I do not get any errors in the console nor in my IDE. I found solutions saying that pushing my build folder can help, but so I did and nothing.
Would someone please pint me to the proper solution, this is my package.json, if necessary I will provide other data.
{
"private": true,
"name": "x",
"description": "y",
"version": "2.0.111",
"license": "MIT",
"scripts": {
"predeploy": "npm version patch && git push && git push --tags",
"deploy": "git push -f heroku master",
"heroku-postbuild": "run-p build",
"dev": "sapper dev",
"build": "sapper build --legacy",
"export": "sapper export --legacy",
"start": "serve -s build",
"cy:run": "cypress run",
"cy:open": "cypress open",
"test": "run-p --race dev cy:run"
},
"dependencies": {
"compression": "^1.7.1",
"lodash-es": "^4.17.15",
"polka": "next",
"serve": "^12.0.0",
"sirv": "^0.4.0"
},
"devDependencies": {
"#babel/core": "^7.0.0",
"#babel/plugin-syntax-dynamic-import": "^7.0.0",
"#babel/plugin-transform-runtime": "^7.0.0",
"#babel/preset-env": "^7.0.0",
"#babel/runtime": "^7.0.0",
"npm-run-all": "^4.1.5",
"rollup": "^1.12.0",
"rollup-plugin-babel": "^4.0.2",
"rollup-plugin-commonjs": "^10.0.0",
"rollup-plugin-json": "^4.0.0",
"rollup-plugin-node-resolve": "^5.2.0",
"rollup-plugin-replace": "^2.0.0",
"rollup-plugin-svelte": "^5.0.1",
"rollup-plugin-terser": "^5.1.1",
"sapper": "^0.27.0",
"svelte": "^3.0.0"
},
"repository": {
"type": "git",
"url": "git#github.com:confrontjs/2019.confrontjs.com.git"
}
}
Thanks!

How to run all tests with node by specifying asterisk (*)?

I'm getting started with testing with this article Deploying our app
Here's my package.json:
{
"name": "complete-toolchain",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "node tests/*.js",
"build": "npm run test && npx parcel build src/index.html"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"axios": "^0.21.0",
"babel-eslint": "^10.1.0",
"eslint": "^7.14.0",
"eslint-plugin-react": "^7.21.5",
"parcel-bundler": "^1.12.4",
"postcss-preset-env": "^6.7.0",
"prettier": "^2.2.0"
},
"dependencies": {
"date-fns": "^2.16.1",
"format-number": "^3.0.0",
"react": "^17.0.1",
"react-async-hook": "^3.6.2",
"react-dom": "^17.0.1"
}
}
I get error when I run npm run test:
Cannot find module 'C:\Users\x\complete-toolchain\tests\*.js'
Why doesn't it understand this? Of course it works with "test": "node tests/nasa-feed.test.js",.

nodemon not refreshing when using typescript

I'm working on an app with NodeJs, express, typescript and nodemon.
But the page is not refreshed when I changed some code in the ts files.
How can I do to compile the ts file in js and refresh the browser with nodemon (or other tool)?
package.json
{
"name": "myapp",
"version": "1.0.0",
"description": "",
"main": "index.js",
"dependencies": {
"bcryptjs": "^2.4.3",
"body-parser": "^1.17.2",
"debug": "^2.6.8",
"dotenv": "^2.0.0",
"express": "^4.15.3",
"iconv-lite": "^0.4.17",
"inversify": "^4.11.1",
"jsonwebtoken": "^7.4.1",
"mongoose": "^5.0.10",
"morgan": "^1.8.2",
"passport": "^0.3.2",
"passport-jwt": "^2.2.1",
"rxjs": "^5.4.2",
"typescript": "^2.7.2",
"winston": "^2.3.1"
},
"devDependencies": {
"#types/chai": "^4.0.0",
"#types/debug": "0.0.29",
"#types/dotenv": "^2.0.20",
"#types/express": "^4.0.35",
"#types/mocha": "^2.2.41",
"#types/mongoose": "^4.7.15",
"#types/morgan": "^1.7.32",
"#types/node": "^6.0.77",
"#types/passport": "^0.3.3",
"#types/passport-jwt": "^2.0.20",
"chai": "^4.0.2",
"chai-http": "^3.0.0",
"gulp": "^3.9.1",
"gulp-clean": "^0.3.2",
"gulp-typescript": "^3.1.7",
"gulp-yaml": "^1.0.1",
"mocha": "^3.4.2",
"mocha-typescript": "^1.1.4"
},
"scripts": {
"start": "gulp build && nodemon dist/index.js",
"build": "gulp build",
"test": "gulp build && mocha -t 30000 dist/**/*.test.js"
},
"repository": {
"type": "git",
"url": "git+https://github.com/devslaw/TypeScript-Node.js-REST-example.git"
},
"keywords": [],
"author": "Arthur Arakelyan <arthur#devslaw.com>",
"license": "ISC",
"homepage": "https://github.com/devslaw/TypeScript-Node.js-REST-example#readme"
}
So know, anytime i make a change, I need to stop the server and run npm start again
The problem lies in the fact that your start script is watching dist/index.js. This folder only changes when the code gets recompiled into plain JavaScript. So you will need to watch the TypeScript files instead. The great thing is that you can change nodemon's default behavior. You will need to add ts-node to your package.json as well.
Try setting the script to something like the following:
nodemon --watch 'src/**/*.ts' --exec 'ts-node' src/index.ts
You will then want to set up a nodemon.json file with the following also:
{
"watch": ["src"],
"ext": "ts",
"exec": "ts-node ./src/index.ts"
}

Git Bash and webpack

Hello guys I'm trying to learn Webpack I've been following some tutorials and I've run into some problems. I've installed webpack locally in folder I am working in with npm install webpack --save-dev. I made two JS scripts and I wanted to bundle them and I've tried following command webpack script-1.js /.bundle.js in WindowsPowerShell (I'm using Windows 7). Now this made the following error
webpack is not recognized as an internal or external command operable program or batch file
So then I installed webpack globally, and when I used the same command in PowerShell (I have opened it as an admin), it made bundle.js file but not in the directory I was working in, but in C:
Now after this failure I've decided to try using git bash. First I've tried this command webpack script-1.js /.bundle.js and got the following error
bash: webpack: command not found
Finally after some trying I was able to make it work using this command in git bash node_modules/.bin/webpack ./script-1.js bundle.js
Is there a way to fix this, so I can just type webpack instead of whole path ? Also is there a way to fix path in PowerShell ?
This is mine package.json
{
"name": "webpack-playlist",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/iamshaunjp/webpack-playlist.git"
},
"author": "me",
"license": "MIT",
"bugs": {
"url": "https://github.com/iamshaunjp/webpack-playlist/issues"
},
"homepage": "https://github.com/iamshaunjp/webpack-playlist#readme",
"devDependencies": {
"webpack": "^2.3.3"
}
}
and this is package.json located in node_modules/webpack/package.json
{
"_args": [
[
{
"raw": "webpack",
"scope": null,
"escapedName": "webpack",
"name": "webpack",
"rawSpec": "",
"spec": "latest",
"type": "tag"
},
"C:\\Users\\Djole\\Desktop\\NetNinja\\webpack-playlist"
]
],
"_from": "webpack#latest",
"_id": "webpack#2.3.3",
"_inCache": true,
"_location": "/webpack",
"_nodeVersion": "7.4.0",
"_npmOperationalInternal": {
"host": "packages-12-west.internal.npmjs.com",
"tmp": "tmp/webpack-2.3.3.tgz_1491205859622_0.6350918470416218"
},
"_npmUser": {
"name": "sokra",
"email": "tobias.koppers#googlemail.com"
},
"_npmVersion": "4.0.5",
"_phantomChildren": {},
"_requested": {
"raw": "webpack",
"scope": null,
"escapedName": "webpack",
"name": "webpack",
"rawSpec": "",
"spec": "latest",
"type": "tag"
},
"_requiredBy": [
"#DEV:/",
"#USER"
],
"_resolved": "https://registry.npmjs.org/webpack/-/webpack-2.3.3.tgz",
"_shasum": "eecc083c18fb7bf958ea4f40b57a6640c5a0cc78",
"_shrinkwrap": null,
"_spec": "webpack",
"_where": "C:\\Users\\Djole\\Desktop\\NetNinja\\webpack-playlist",
"author": {
"name": "Tobias Koppers #sokra"
},
"bin": {
"webpack": "./bin/webpack.js"
},
"bugs": {
"url": "https://github.com/webpack/webpack/issues"
},
"dependencies": {
"acorn": "^4.0.4",
"acorn-dynamic-import": "^2.0.0",
"ajv": "^4.7.0",
"ajv-keywords": "^1.1.1",
"async": "^2.1.2",
"enhanced-resolve": "^3.0.0",
"interpret": "^1.0.0",
"json-loader": "^0.5.4",
"loader-runner": "^2.3.0",
"loader-utils": "^0.2.16",
"memory-fs": "~0.4.1",
"mkdirp": "~0.5.0",
"node-libs-browser": "^2.0.0",
"source-map": "^0.5.3",
"supports-color": "^3.1.0",
"tapable": "~0.2.5",
"uglify-js": "^2.8.5",
"watchpack": "^1.3.1",
"webpack-sources": "^0.2.3",
"yargs": "^6.0.0"
},
"description": "Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jsx, es7, css, less, ... and your custom stuff.",
"devDependencies": {
"beautify-lint": "^1.0.3",
"benchmark": "^2.1.1",
"bundle-loader": "~0.5.0",
"codacy-coverage": "^2.0.1",
"codecov.io": "^0.1.2",
"coffee-loader": "~0.7.1",
"coffee-script": "^1.10.0",
"coveralls": "^2.11.2",
"css-loader": "~0.25.0",
"es6-promise-polyfill": "^1.1.1",
"eslint": "3.12.2",
"eslint-plugin-node": "^3.0.5",
"express": "~4.13.1",
"extract-text-webpack-plugin": "^2.0.0-beta",
"file-loader": "~0.9.0",
"i18n-webpack-plugin": "^0.3.0",
"istanbul": "^0.4.5",
"jade": "^1.11.0",
"jade-loader": "~0.8.0",
"js-beautify": "^1.5.10",
"less": "^2.5.1",
"less-loader": "^2.0.0",
"lodash": "^4.17.4",
"mocha": "^3.2.0",
"mocha-lcov-reporter": "^1.0.0",
"nsp": "^2.6.1",
"raw-loader": "~0.5.0",
"react": "^15.2.1",
"react-dom": "^15.2.1",
"script-loader": "~0.7.0",
"should": "^11.1.1",
"simple-git": "^1.65.0",
"sinon": "^1.17.7",
"style-loader": "~0.13.0",
"url-loader": "~0.5.0",
"val-loader": "~0.5.0",
"vm-browserify": "~0.0.0",
"webpack-dev-middleware": "^1.9.0",
"worker-loader": "~0.7.0"
},
"directories": {},
"dist": {
"shasum": "eecc083c18fb7bf958ea4f40b57a6640c5a0cc78",
"tarball": "https://registry.npmjs.org/webpack/-/webpack-2.3.3.tgz"
},
"engines": {
"node": ">=4.3.0 <5.0.0 || >=5.10"
},
"files": [
"lib/",
"bin/",
"buildin/",
"hot/",
"web_modules/",
"schemas/"
],
"gitHead": "ba24c1b163dc038ed738eb4a57dcb241bf63146d",
"homepage": "https://github.com/webpack/webpack",
"license": "MIT",
"main": "lib/webpack.js",
"maintainers": [
{
"name": "jhnns",
"email": "mail#johannesewald.de"
},
{
"name": "sokra",
"email": "tobias.koppers#googlemail.com"
},
{
"name": "thelarkinn",
"email": "sean.larkin#cuw.edu"
}
],
"name": "webpack",
"optionalDependencies": {},
"readme": "ERROR: No README data found!",
"repository": {
"type": "git",
"url": "git+https://github.com/webpack/webpack.git"
},
"scripts": {
"appveyor:benchmark": "npm run benchmark",
"appveyor:test": "node --max_old_space_size=4096 node_modules\\mocha\\bin\\mocha --harmony test/*.test.js",
"beautify-lint": "beautify-lint 'lib/**/*.js' 'hot/**/*.js' 'bin/**/*.js' 'benchmark/*.js' 'test/*.js'",
"benchmark": "mocha test/*.benchmark.js --harmony -R spec",
"build:examples": "cd examples && node buildAll.js",
"cover": "node --harmony ./node_modules/istanbul/lib/cli.js cover -x '**/*.runtime.js' node_modules/mocha/bin/_mocha -- test/*.test.js",
"cover:min": "node --harmony ./node_modules/.bin/istanbul cover -x '**/*.runtime.js' --report lcovonly node_modules/mocha/bin/_mocha -- test/*.test.js",
"lint": "eslint lib bin hot buildin test/**/webpack.config.js test/binCases/**/test.js examples/**/webpack.config.js",
"lint-files": "npm run lint && npm run beautify-lint",
"nsp": "nsp check --output summary",
"pretest": "npm run lint-files",
"publish-patch": "npm run lint && npm run beautify-lint && mocha && npm version patch && git push && git push --tags && npm publish",
"test": "mocha test/*.test.js --harmony --check-leaks",
"travis:benchmark": "npm run benchmark",
"travis:lint": "npm run lint-files && npm run nsp",
"travis:test": "npm run cover:min"
},
"version": "2.3.3",
"web": "lib/webpack.web.js"
}
EDIT:
I've come with following solution in the end:
Add this to your package.json file
"scripts" : {
"build" : "webpack ./entry.js bundle.js"
}
and then type npm run build this will still run the local version because npm will first look in ./node_modules/.bin/
That kind of path is what is used in a git for Windows bash.
See this issue
We use cmdr (http://cmder.net/ ) to emulate console on Windows machines.
Still we had to modify scripts and separate build to clean and build tasks to get it working.
"scripts": {
"clean": "rm -rf dist",
"build": "node_modules/.bin/babel-node -- ./node_modules/webpack/bin/webpack.js --stats --config ./webpack/prod.config.js",
...
},
You can see a similar instruction in this project package.json:
"build-main": "cross-env NODE_ENV=production node -r babel-register ./node_modules/webpack/bin/webpack --config webpack.config.electron.js --progress --profile --colors",

Babel and Deploy Nodejs to Google App Engine

I'm a newbie nodejs. I have a trouble about deploying nodejs app to google app engine. This is my error, I have been trying to fix it but it's not work. I've installed babel.
Bug
Updating service [default]...failed.
ERROR: (gcloud.app.deploy) Error Response: [9]
Application startup error:
restaurant_api#1.0.0 prestart /app
npm run -s build
You have mistakenly installed the babel package, which is a no-op in Babel 6.
Babel's CLI commands have been moved from the babel package to the babel-cli package.
npm uninstall babel
npm install --save-dev babel-cli
This is my package.json
"main": "dist",
"scripts": {
"dev": "NODE_ENV=development nodemon -w src --exec \"babel-node src --presets es2015,stage-0\"",
"build": "babel src -s -D -d dist --presets es2015,stage-0",
"start": "NODE_ENV=production pm2 start dist",
"prestart": "npm run -s build",
"lint": "eslint src",
"test": "echo \"Error: no test specified\" && exit 1",
"babel-version": "babel --version"
},
"eslintConfig": {
"parserOptions": {
"ecmaVersion": 7,
"sourceType": "module"
},
"env": {
"node": true
},
"rules": {
"no-console": 0,
"no-unused-vars": 1
}
},
"author": "",
"license": "ISC",
"dependencies": {
"babel": "^6.23.0",
"body-parser": "^1.17.0",
"express": "^4.15.0",
"express-jwt": "^5.1.0",
"jsonwebtoken": "^7.3.0",
"mongoose": "^4.8.5",
"passport": "^0.3.2",
"passport-local": "^1.0.0",
"passport-local-mongoose": "^4.0.0",
"pm2": "^2.4.2"
},
"devDependencies": {
"babel-cli": "^6.23.0",
"babel-eslint": "^7.1.1",
"babel-preset-es2015": "^6.22.0",
"babel-preset-stage-0": "^6.22.0",
"eslint": "^3.16.1"
}
Problem is quite simple, if you notice clearly GAE, does not install dev-dependencies. So move your dev-deps above inside deps , like I did and babel no found error is gone.
{
"name": "scraping",
"version": "0.3.0",
"description": "Starter project for an ES6 RESTful Express API",
"main": "dist",
"scripts": {
"dev": "nodemon -w src --exec \"babel-node src --presets es2015,stage-0\"",
"build": "babel src -s -D -d dist --presets es2015,stage-0",
"start": "node dist",
"prestart": "npm run -s build",
"test": "eslint src"
},
"eslintConfig": {
"extends": "eslint:recommended",
"parserOptions": {
"ecmaVersion": 7,
"sourceType": "module"
},
"env": {
"node": true
},
"rules": {
"no-console": 0,
"no-unused-vars": 1
}
},
"repository": {
"type": "git",
"url": "git+https://github.com/developit/express-es6-rest-api.git"
},
"author": "Saransh Sharma <jason#developit.ca>",
"license": "MIT",
"dependencies": {
"body-parser": "^1.13.3",
"compression": "^1.5.2",
"cors": "^2.7.1",
"express": "^4.13.3",
"morgan": "^1.8.0",
"resource-router-middleware": "^0.6.0",
"#jonstuebe/scraper": "^0.1.4",
"babel-cli": "^6.9.0",
"babel-core": "^6.9.0",
"babel-preset-es2015": "^6.9.0",
"babel-preset-stage-0": "^6.5.0",
"eslint": "^3.1.1",
"nodemon": "^1.9.2"
},
"devDependencies": {
"babel-cli": "^6.9.0",
"babel-core": "^6.9.0",
"babel-preset-es2015": "^6.9.0",
"babel-preset-stage-0": "^6.5.0",
"eslint": "^3.1.1",
"nodemon": "^1.9.2"
},
"bugs": {
"url": "https://github.com/developit/express-es6-rest-api/issues"
},
"homepage": "https://github.com/developit/express-es6-rest-api#readme",
"keywords": [
"scraper",
"product",
"from",
"amazon"
]
}
The clue is in the error message.
In your devDependencies section, you already have babel-cli included.
However, your dependencies section still has a reference to "babel": "^6.23.0".
Either remove this line, or replace it with babel-cli, leaving you with:
"dependencies": {
"babel-cli": "^6.23.0",
"body-parser": "^1.17.0",
"express": "^4.15.0",
"express-jwt": "^5.1.0",
"jsonwebtoken": "^7.3.0",
"mongoose": "^4.8.5",
"passport": "^0.3.2",
"passport-local": "^1.0.0",
"passport-local-mongoose": "^4.0.0",
"pm2": "^2.4.2"
},
You need to install babel-cli globally, i.e. run the command "npm install babel-cli -g" as part of your build npm script, or create a pre-install script that install it if you want to keep it more organized in case you need to add more things later on.
"scripts": {
"dev": "NODE_ENV=development nodemon -w src --exec \"babel-node src --presets es2015,stage-0\"",
"build": "npm install bable-cli -g && babel src -s -D -d dist --presets es2015,stage-0",

Resources