Error: Cannot find module 'js-yaml' when running "bower install" - angularjs

I am walking through basic set up of an AngularJS application (Just getting started) and am currently trying to install Bower components for the application.
When I run bower install from the terminal, I get the following error:
Error: Cannot find module 'js-yaml'
at Function.Module._resolveFilename (module.js:337:15)
at Function.Module._load (module.js:287:25)
at Module.require (module.js:366:17)
at require (module.js:385:17)
at Object.<anonymous> (Path\bower\node_modules\configstore\index.js:9:12)
at Module._compile (module.js:425:26)
at Object.Module._extensions..js (module.js:432:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:311:12)
at Module.require (module.js:366:17)
at require (module.js:385:17)
I haven’t specified js-yaml module anywhere in my scripts (as far as I am aware), so not sure where this dependency is coming from.
I have tried deleting the node_modules folder, clearing the npm cache, including js-yaml within the package.json file then re-running npm install, but I get the same error when running bower install
If it helps, my bower.json and package.json files are shown below:
Bower.json
{
"name": "starter-node-angular",
"version": "1.0.0",
"dependencies": {
"bootstrap": "latest",
"font-awesome": "latest",
"animate.css": "latest",
"angular": "latest",
"angular-route": "latest"
}
}
package.json
{
"name": "starter-node-angular",
"main": "server.js",
"dependencies": {
"express" : "~4.5.1",
"mongoose" : "~3.8.0",
"body-parser" : "~1.4.2",
"method-override" : "~2.0.2",
"js-yaml" : "latest"
}
}
I am using WebStorm 10.0.4 (empty project as the starting point).
Has anyone come across this or a similar issue and possible point me in the right direction on how to resolve the issue?

Running sudo npm install -g js-yaml first should get you in the right direction.

My guess is that its not related to your application but bower is broken. Try reinstall it:
$ npm uninstall bower
And then reinstall it like this:
$ npm install -g bower
That solved it for me.

Related

new gatsby project is not running

I've created new gatsby project. After successful installation, I tried to run it with command npm run develop and gatsby develop but it is throwing error. Unable to figure out the root cause of error. I tried re installing node_modules but nothing is working! Please Help! Thank you!
ERROR:
D:\FC\gatsby-shopify-site>npm run develop
> test-site#1.0.0 develop
> gatsby develop
D:\FC\gatsby-shopify-site\node_modules\yoga-layout-prebuilt\yoga-layout\build\Release\nbind.js:53
throw ex;
^
Error: The specified module could not be found.
\\?\D:\FC\gatsby-shopify-site\node_modules\#parcel\source-map\parcel_sourcemap_node\artifacts\index.win32-x64-msvc.node
at Object.Module._extensions..node (node:internal/modules/cjs/loader:1185:18)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at require (node:internal/modules/cjs/helpers:102:18)
at Object.<anonymous> (D:\FC\gatsby-shopify-site\node_modules\#parcel\source-map\parcel_sourcemap_node\index.js:15:18)
at Module._compile (node:internal/modules/cjs/loader:1103:14)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1155:10)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at require (node:internal/modules/cjs/helpers:102:18)
at Object.<anonymous> (D:\FC\gatsby-shopify-site\node_modules\#parcel\source-map\dist\node.js:14:18)
at Module._compile (node:internal/modules/cjs/loader:1103:14)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1155:10)
at Module.load (node:internal/modules/cjs/loader:981:32) {
code: 'ERR_DLOPEN_FAILED'
}
package.json
{
"name": "test-site",
"version": "1.0.0",
"private": true,
"description": "test-site",
"keywords": [
"gatsby"
],
"scripts": {
"develop": "gatsby develop",
"start": "gatsby develop",
"build": "gatsby build",
"serve": "gatsby serve",
"clean": "gatsby clean"
},
"dependencies": {
"gatsby": "^4.9.0",
"react": "^17.0.1",
"react-dom": "^17.0.1"
}
}
gatsby-config.js
module.exports = {
siteMetadata: {
siteUrl: `https://www.yourdomain.tld`,
},
plugins: [
]
}
PLEASE HELP!!!
I have solved the issue by adding a library of Microsoft Visual C++ 2015 Redistribution on my computer as the package is failing due to a missing library.
The download link is here: https://aka.ms/vs/17/release/vc_redist.x64.exe
It took a lot of time for mine to solve. Hope that it will help you.
Where (in what folder) have you run npm install?
In D drive and inside FC folder
You must install your dependencies inside your project folder, so inside gatsby-shopify-site. In your case, you installed your dependencies in the parent folder (FC),
Move inside D:\FC\gatsby-shopify-site and run:
npm install
Once done:
gatsby develop
Make sure you installed the right node js version for your Windows system.
As mentioned in the error, it is trying to execute a win32-x64 version. In my case Node website recommended the wrong version when downloading and this was fixed by changing it.
Error: The specified module could not be found.
\\?\D:\FC\gatsby-shopify-site\node_modules\#parcel\source-map\parcel_sourcemap_node\artifacts\index.win32-x64-msvc.node
Could you try yarn instead?
npm install -g yarn
and then run your command like this
yarn run develop

Node.js node_modules\grpc\src\node\extension_binary\node-v83-win32-x64-unknown\grpc_node.node

I was doing a proof of concept on gRPC using node.js
Here is my package.json
{
"name": "grpc-node-demo",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"dependencies": {
"#grpc/proto-loader": "^0.1.0",
"grpc": "^1.11.0",
"lodash": "^4.6.1"
}
}
After writing in proto file, client and server files. When I run the command node server.js
I got the following error
PS C:\Learnings\node\grpc-nodejs-demo> node server.js
C:\Learnings\node\grpc-nodejs-demo\node_modules\grpc\src\grpc_extension.js:58
throw e;
^
Error: Failed to load C:\Learnings\node\grpc-nodejs-demo\node_modules\grpc\src\node\extension_binary\node-v83-win32-x64-unknown\grpc_node.node. \\?\C:\Learnings\node\grpc-nodejs-demo\node_modules\grpc\src\node\extension_binary\node-v83-win32-x64-unknown\grpc_node.node is not a valid Win32 application.
\\?\C:\Learnings\node\grpc-nodejs-demo\node_modules\grpc\src\node\extension_binary\node-v83-win32-x64-unknown\grpc_node.node
at Object.Module._extensions..node (internal/modules/cjs/loader.js:1122:18)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14)
at Module.require (internal/modules/cjs/loader.js:952:19)
at require (internal/modules/cjs/helpers.js:88:18)
at Object.<anonymous> (C:\Learnings\node\grpc-nodejs-demo\node_modules\grpc\src\grpc_extension.js:32:13)
at Module._compile (internal/modules/cjs/loader.js:1063:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14)
PS C:\Learnings\node\grpc-nodejs-demo>
Any thoughts??
After some research, I did the following steps to resolve the issue
I was missing node-gyp - which is Node.js native addon build tool. It can be installed by
npm install -g node-gyp
Install Python
Install Visual C++ Build Environment
Clean up node-modules
Then do in the folder npm install
The following link talks the above steps in detail:
https://github.com/nodejs/node-gyp#on-windows

Yarn start - Command failed with exit code 1

I'm having a little problem while trying to run "Yarn start" in my ReactJS project.
The error is pasted below:
yarn run v1.22.5
$ webpack-dev-server --mode development
The CLI moved into a separate package: webpack-cli
Please install 'webpack-cli' in addition to webpack itself to use the CLI
-> When using npm: npm i -D webpack-cli
-> When using yarn: yarn add -D webpack-cli
internal/modules/cjs/loader.js:883
throw err;
^
Error: Cannot find module 'webpack-cli/bin/config-yargs'
Require stack:
- C:\3AM\web\node_modules\webpack-dev-server\bin\webpack-dev-server.js
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
at Function.Module._load (internal/modules/cjs/loader.js:725:27)
at Module.require (internal/modules/cjs/loader.js:952:19)
at require (internal/modules/cjs/helpers.js:88:18)
at Object.<anonymous> (C:\3AM\web\node_modules\webpack-dev-server\bin\webpack-dev-server.js:65:1)
at Module._compile (internal/modules/cjs/loader.js:1063:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12) {
code: 'MODULE_NOT_FOUND',
requireStack: [
'C:\\3AM\\web\\node_modules\\webpack-dev-server\\bin\\webpack-dev-server.js'
]
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
I've tried to install webpack-dev-server with npm and yarn, but it didn't solve.
In package.json change the start script to "start": "webpack serve".

How to fix Next.js Vercel deployment module not found error

My next.js app works on my machine and was working when deployed on Vercel but now it fails when building on Vercel with the following error:
I've tried deleting node_modules and running npm install a few times but with no joy.
Any help would be hugely appreciated. Thank you!
Running "npm run build"
20:43:24.926
tdwcks#1.0.0 build /vercel/5ccaedc9
20:43:24.926
next build
20:43:24.967
internal/modules/cjs/loader.js:983
20:43:24.967
throw err;
20:43:24.967
^
20:43:24.967
Error: Cannot find module '../build/output/log'
20:43:24.967
Require stack:
20:43:24.967
- /vercel/5ccaedc9/node_modules/.bin/next
20:43:24.967
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:980:15)
20:43:24.967
at Function.Module._load (internal/modules/cjs/loader.js:862:27)
20:43:24.967
at Module.require (internal/modules/cjs/loader.js:1042:19)
20:43:24.967
at require (internal/modules/cjs/helpers.js:77:18)
20:43:24.967
at Object. (/vercel/5ccaedc9/node_modules/.bin/next:2:46)
20:43:24.967
at Module._compile (internal/modules/cjs/loader.js:1156:30)
20:43:24.967
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1176:10)
20:43:24.967
at Module.load (internal/modules/cjs/loader.js:1000:32)
20:43:24.967
at Function.Module._load (internal/modules/cjs/loader.js:899:14)
20:43:24.967
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12) {
20:43:24.967
code: 'MODULE_NOT_FOUND',
20:43:24.967
requireStack: [ '/vercel/5ccaedc9/node_modules/.bin/next' ]
20:43:24.967
}
20:43:24.969
npm ERR! code ELIFECYCLE
20:43:24.969
npm ERR! errno 1
20:43:24.970
npm ERR! tdwcks#1.0.0 build: next build
20:43:24.970
npm ERR! Exit status 1
20:43:24.970
npm ERR!
20:43:24.970
npm ERR! Failed at the tdwcks#1.0.0 build script.
20:43:24.970
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
20:43:24.974
npm ERR! A complete log of this run can be found in:
20:43:24.974
npm ERR! /vercel/.npm/_logs/2020-06-17T19_43_24_971Z-debug.log
20:43:24.979
Error: Command "npm run build" exited with 1
20:43:25.342
[dmesg] follows:
20:43:25.342
[ 962.449223] ecs-bridge: port 1(veth2a021300) entered disabled state
20:43:25.342
[ 962.453655] device veth2a021300 entered promiscuous mode
20:43:25.342
[ 962.457686] ecs-bridge: port 1(veth2a021300) entered blocking state
20:43:25.342
[ 962.462004] ecs-bridge: port 1(veth2a021300) entered forwarding state
20:43:26.242
Done with "package.json"
Here's my Package.json
{
"name": "tdwcks",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "next",
"build": "next build",
"start": "next start"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"cjs": "0.0.11",
"core-util-is": "^1.0.2",
"framer-motion": "^1.11.0",
"gray-matter": "^4.0.2",
"next": "^9.4.4",
"raw-loader": "^4.0.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-ga": "^3.0.0",
"react-markdown": "^4.3.1",
"react-player": "^2.2.0",
"react-scripts": "^3.4.1"
},
"devDependencies": {
"postcss-preset-env": "^6.7.0",
"tailwindcss": "^1.4.6"
}
}
This answer worked for me: https://stackoverflow.com/a/55541435/3051080
TL;DR; update git cache:
git rm -r --cached .
git add --all .
git commit -a -m "Versioning untracked files"
git push origin master
I had to edit my package.json to use the next binary that ships in the node_modules/next directory:
"scripts": {
"start": "node_modules/next/dist/bin/next start -p $PORT"
}
Not the most elegant fix but it works.
This error typically happens if you're accidentally committing node_modules to your project's Git Repostiory.
Could you try to do the following?
Ensure all changes have been committed and you have a clean directory.
Run rm -rf node_modules (or delete the folder on Windows).
Run git add -A then git commit -m "Remove all module files".
Add node_modules to your .gitignore file (and save).
Run git add -A then git commit -m "Update ignored files".
Verify your directory is completely clean via git status.
Then, run git push. This deployment should work on Vercel.
Finally, re-run npm i or yarn depending on your package manager to get your local copy working.
I'm having this exact same issue. I think it may be an internal issue with Vercel's deployment infrastructure. Notice the line it is failing on:
Error: Cannot find module '../build/output/log' 20:43:24.967
Require stack: 20:43:24.967
- /vercel/5ccaedc9/node_modules/.bin/next 20:43:24.967
My issue started yesterday, quite unexpectedly -- i.e. with a very simple commit. In my case, previously successful deploys also fail. Likewise, deleting the project and starting over did not help. I am in communication with Vercel support but they have not yet acknowledged the problem is on their end yet or offered any kind of solution.
I had the same issue. In my github desktop I noticed that a file that was capitalized in the editor was not in the github desktop. Fixed the spelling to match what was showing on github and the project built successfully.
It seems like I have run into the same error.
The strange thing is that I have been building on Vercel all weekend without any problems, and it only started failing after I added Tailwind CSS to my project.
The first build with the Tailwind CSS addition succeded but styling was not loaded.
You can still see the result at https://rolfmadsen.now.sh/.
The local build with "vercel dev" still runs perfectly.
See the repository at https://github.com/rolfmadsen/search
Error from Build logs:
22:28:35.104
Running "npm run build"
22:28:35.287
> search#0.1.0 build /vercel/6ddf29b8
22:28:35.287
> next build
22:28:35.328
internal/modules/cjs/loader.js:983
22:28:35.329
throw err;
22:28:35.329
^
22:28:35.329
Error: Cannot find module '../build/output/log'
22:28:35.329
Require stack:
22:28:35.329
- /vercel/6ddf29b8/node_modules/.bin/next
22:28:35.329
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:980:15)
22:28:35.329
at Function.Module._load (internal/modules/cjs/loader.js:862:27)
22:28:35.329
at Module.require (internal/modules/cjs/loader.js:1042:19)
22:28:35.329
at require (internal/modules/cjs/helpers.js:77:18)
22:28:35.329
at Object.<anonymous> (/vercel/6ddf29b8/node_modules/.bin/next:2:46)
22:28:35.329
at Module._compile (internal/modules/cjs/loader.js:1156:30)
22:28:35.329
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1176:10)
22:28:35.329
at Module.load (internal/modules/cjs/loader.js:1000:32)
22:28:35.329
at Function.Module._load (internal/modules/cjs/loader.js:899:14)
22:28:35.329
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12) {
22:28:35.329
code: 'MODULE_NOT_FOUND',
22:28:35.329
requireStack: [ '/vercel/6ddf29b8/node_modules/.bin/next' ]
22:28:35.329
}
22:28:35.331
npm ERR! code ELIFECYCLE
22:28:35.331
npm ERR! errno 1
22:28:35.332
npm ERR! search#0.1.0 build: `next build`
22:28:35.332
npm ERR! Exit status 1
22:28:35.332
npm ERR!
22:28:35.332
npm ERR! Failed at the search#0.1.0 build script.
22:28:35.332
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
22:28:35.336
npm ERR! A complete log of this run can be found in:
22:28:35.336
npm ERR! /vercel/.npm/_logs/2020-06-21T20_28_35_332Z-debug.log
22:28:35.342
Error: Command "npm run build" exited with 1
in my case it looks like something to do with yarn and the next dependency i.e. inside node_modules/next/dist/bin/next having conflicts information about something.
never quite understand why after using next & building our code into production we still have to rely on the (relatively) heavy module next.
the whole notion of doing build is supposed so that it becomes independent of the build tools.
I tried all of the above problems and nothing works.
The problem got solved when I changed the version of next.js. In case, someone is searching for a solution and nothing works...
If the program runs normally by executing node_modules/next/dist/bin/next, you should suspect that the symbolic link of the file is broken.
In my case, it occurred during AWS deployment, and it occurred in the process of compressing the files for deployment.
So, I was able to solve the problem by adding the symlinks option during compression as shown below.
zip -r --symlinks xxxx
If it is deployed on a server such as AWS, like me, download the actually distributed program and
Check the node_modules/.bin/next file. If the symbolic link is broken, you will need to find and fix the cause of the broken link during the deployment process.
cf) https://github.com/vercel/next.js/discussions/14897#
just use these commands in your GIT
git rm -r --cached .
git add --all .
git commit -a -m "Bugs"
git push origin master
What about creating a .gitignore file, and adding the .next folder to it ?
How I resolved the missing module error on Vercel.
install the package explicitly so that it is present in your package.json
then import the supposed missing module into the app and use it.
For Example (just a scenario) // lets assume lodash is said to be the missing module,
1 Make sure it is present in your package.json
"dependencies": {
// some dependencies ...
"lodash": "^4.17.20",
// some other dependencies ...
},
2 Import and use it in your app (usually, I just console.log the import in a non-production env.)
import LODASH from 'lodash'
if (process.env.NODE_ENV !== 'production') console.log(LODASH)
I created the folder in lowercased, then, renamed it in capitalized, updated all the imports, but, for some reason, Github didn't update the folder name when I pushed the changes. I needed to renamed with a different name. It worked.
For me it was a problem with that specific package, when I looked for it in my package.json and under node_modules i couldn't find it. Even though it was working in local builds somehow.
I added a NODE_ENV="production" environment variable in vercel which hosed everything for me. Once I removed it, things recovered.
Delete package-lock.json (rm package-lock.json)
Delete node_modules (rm -R node_modules)
Switch versions of Node, which is easy if you have Node installed via NVM (nvm install 17, nvm use 17)
Install dependencies again with new version of node (npm install)
I ran into this issue on a server running node 16.15.0 LTS, On my local machine node v16.12.0, and on another server running node v12.22.10 and it was not giving the error.
Took a look at my dependencies and decided to switch to Node 17.
devDependencies": {
"#types/node": "17.0.23",
"#types/react": "17.0.43",
After following the steps above and using Node 17 code ran successfully, and no more error.
If node_modules are transferred to server via git as stated in #Joe Haddad's answer. A different strategy for dealing with the issue worked better for me.
On the server, remove all node and next build files carried over to server, re-install and re-build
rm -R node_modules && rm -R .next && rm package-lock.json && npm install && npm run build
Edit or create .gitignore and add node_modules and .next then do the following.
Clear out cached files in git repo, re-add files respecting .gitignore, commit and push changes back to your local computer.
git rm -r --cached ./ && git add ./ && git commit -a -m "Removing ignored files" && git push
On local computer to sync up with newly ignored files. Does not affect local work environment and now you can push and pull successfully.
git pull
npm install
This approach is faster and saves you the trouble of dealing with git stuff on local machine and pushing back to the server.

Requires Babel "7.0.0-0" but was loaded with "6.26.3"

Keep getting this error no matter what I tried installing (babel wise) as I follow other similar reports. this is the stack trace:
error: bundling failed: Error: Requires Babel "^7.0.0-0", but was
loaded with "6.26.3". If you are sure you have a compatible version of
#babel/core, it is likely that something in your build process is
loading the wrong version. Inspect the stack trace of this error to
look for the first entry that doesn't mention "#babel/core" or
"babel-core" to see what is calling Babel. (While processing preset:
"C:\\Users\\Admin-ESS\\Absent\\node_modules\\#babel\\preset-env\\lib\\index.js")
at throwVersionError (C:\Users\Admin-ESS\Absent\node_modules\#babel\preset-env\node_modules\#babel\helper-plugin-utils\lib\index.js:65:11)
at Object.assertVersion (C:\Users\Admin-ESS\Absent\node_modules\#babel\preset-env\node_modules\#babel\helper-plugin-utils\lib\index.js:13:11)
at _default (C:\Users\Admin-ESS\Absent\node_modules\#babel\preset-env\lib\index.js:150:7)
at C:\Users\Admin-ESS\Absent\node_modules\#babel\preset-env\node_modules\#babel\helper-plugin-utils\lib\index.js:19:12
at C:\Users\Admin-ESS\Absent\node_modules\metro\node_modules\babel-core\lib\transformation\file\options\option-manager.js:317:46
at Array.map (<anonymous>)
at OptionManager.resolvePresets (C:\Users\Admin-ESS\Absent\node_modules\metro\node_modules\babel-core\lib\transformation\file\options\option-manager.js:275:20)
at OptionManager.mergePresets (C:\Users\Admin-ESS\Absent\node_modules\metro\node_modules\babel-core\lib\transformation\file\options\option-manager.js:264:10)
at OptionManager.mergeOptions (C:\Users\Admin-ESS\Absent\node_modules\metro\node_modules\babel-core\lib\transformation\file\options\option-manager.js:249:14)
at OptionManager.init (C:\Users\Admin-ESS\Absent\node_modules\metro\node_modules\babel-core\lib\transformation\file\options\option-manager.js:368:12)
at File.initOptions (C:\Users\Admin-ESS\Absent\node_modules\metro\node_modules\babel-core\lib\transformation\file\index.js:212:65)
at new File (C:\Users\Admin-ESS\Absent\node_modules\metro\node_modules\babel-core\lib\transformation\file\index.js:135:24)
at Pipeline.transform (C:\Users\Admin-ESS\Absent\node_modules\metro\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
at Object.transform (C:\Users\Admin-ESS\Absent\node_modules\metro\src\transformer.js:135:5)
at Object.transformCode [as transform] (C:\Users\Admin-ESS\Absent\node_modules\metro\src\JSTransformer\worker\index.js:253:15)
at execMethod (C:\Users\Admin-ESS\Absent\node_modules\jest-worker\build\child.js:92:29)
at process.on (C:\Users\Admin-ESS\Absent\node_modules\jest-worker\build\child.js:42:7)
at process.emit (events.js:180:13)
at emit (internal/child_process.js:783:12)
and my package.json:
{
"name": "Absent",
"version": "0.1.0",
"private": true,
"devDependencies": {
"babel-preset-react-native-stage-0": "^1.0.1",
"jest": "^23.5.0",
"jest-react-native": "^18.0.0",
"react-test-renderer": "16.3.1"
},
"scripts": {
"start": "react-native start",
"android": "react-native run-android",
"ios": "react-native run-ios",
"test": "jest"
},
"jest": {
"preset": "react-native"
},
"dependencies": {
"#babel/core": "^7.0.0-rc.1",
"#babel/preset-env": "^7.0.0-rc.1",
"#babel/preset-react": "^7.0.0-rc.1",
"jail-monkey": "^1.0.0",
"prop-types": "^15.6.2",
"react": "16.3.1",
"react-native": "^0.55.4",
"react-native-device-info": "^0.22.4",
"react-native-elements": "^0.19.1",
"react-native-firebase": "^4.3.8",
"react-native-modal": "^6.5.0",
"react-native-router-flux": "^4.0.1",
"react-native-size-matters": "^0.1.2",
"react-native-vector-icons": "^5.0.0",
"react-redux": "^5.0.7",
"redux": "^4.0.0",
"redux-thunk": "^2.3.0"
},
"rnpm": {
"assets": [
"./assets/fonts/"
]
}
}
Any pointers would be greatly appreciated here...
Test which version you are running with cmd
babel -V
If it is not verion 7 or higher
npm uninstall babel-cli -g
npm uninstall babel-core -g
And
npm install #babel/cli -g
npm install #babel/core -g
If you are using Jest run
npm install babel-core#7.0.0-bridge.0 --save-dev
Uninstall and reinstall #babel/node solves the problem if you do node development.
Looks like you need to install babel-core as the docs suggest:
https://jestjs.io/docs/en/getting-started#using-babel
yarn add --dev babel-jest babel-core#^7.0.0-bridge.0 #babel/core regenerator-runtime
Sometimes its because you have installed both babel-cli and babel/cli, or babel-core and #babel/core
It causes conflicts
So
1) delete node_modules
2) remove babel-cli, babel-core from your package.json, keep #babel/core, #babel/cli
3) npm install
babel-cli conflicts with #babel/cli
bable-core conflicts with #babel/core
For the ones who still fighting that, 4 days ago Jest v24 released with native support for babel 7. enjoy.
None of the solutions I found online worked, I fixed it the following way:
Remove jest and #babel/core from package.json (keep babel-core v7 bridge)
Remove node_modules and package-lock.json
npm install
npm install jest #babel/core --save-dev
From the Babel Docs, I found that there is an issue with the order in which you install the deps.
Note: Please install #babel/cli and #babel/core first before npx babel, otherwise npx will install out-of-dated babel 6.x.
As per the usage docs. I found that removing both items from package.json and adding them in order, fixed my issue. Bizarre edge case.
The issue on my side was a conflict between babel-core, imported by babel-register, and #babel/core, required by Babel documentation for latest usage and set as root npm dependency
It seems babel-register has been moved to #babel/register. Babel didn't update docs with the new module name although they did for their cli/core packages
Here is an update of setup babel doc that works for me:
Installation
npm install --save-dev #babel/register
Usage
In your package.json file make the following changes:
{
"scripts": {
"test": "mocha --require #babel/register"
}
}
you need this 4 packages, that will fix the issue:
npm install #babel/cli
npm install #babel/core
npm install #babel/node
npm install #babel/preset-env
In my case, the issue was caused by upgrading my #babel/core version, while I kept an outdated webpack (and/or webpack-cli, I simply treated them identically in batch) version. I happened to be using a Webpack config file that was webpack.config.babel.js. Webpack seems to deal with this internally by using babel-register (see this SO answer). This was evidenced by my require stack:
at OptionManager.mergePresets (/Users/me/Projects/github-wide-mode/node_modules/babel-core/lib/transformation/file/options/option-manager.js:264:10)
at OptionManager.mergeOptions (/Users/me/Projects/my-project/node_modules/babel-core/lib/transformation/file/options/option-manager.js:249:14)
at OptionManager.init (/Users/me/Projects/my-project/node_modules/babel-core/lib/transformation/file/options/option-manager.js:368:12)
at compile (/Users/me/Projects/my-project/node_modules/babel-register/lib/node.js:103:45)
at loader (/Users/me/Projects/my-project/node_modules/babel-register/lib/node.js:144:14)
at Object.require.extensions.<computed> [as .js] (/Users/me/Projects/my-project/node_modules/babel-register/lib/node.js:154:7)
^^^^^^^^^^^^^^
at require (/Users/me/Projects/my-project/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
at WEBPACK_OPTIONS (/Users/me/Projects/my-project/node_modules/webpack-cli/bin/utils/convert-argv.js:114:13)
at requireConfig (/Users/me/Projects/my-project/node_modules/webpack-cli/bin/utils/convert-argv.js:116:6)
So webpack-cli was calling babel-register – whose version I presume was dictated by the outdated version of webpack-cli – causing it to target an older version of #babel/babel-core than I had installed.
The solution
I uninstalled the webpack and webpack-cli packages, deleted my node_modules/ and package-lock.json, and then did a fresh npm install.
If this doesn't immediately work, I would suggest following the suggestion included in the error:
Error: Requires Babel "^7.0.0-0", but was loaded with "6.26.3". If you are sure you have a compatible version of #babel/core, it is likely that something in your build process is loading the wrong version. Inspect the stack trace of this error to look for the first entry that doesn't mention "#babel/core" or "babel-core" to see what is calling Babel.
to pinpoint what is causing (what is most likely) the dependency mismatch. I would also recommend deleting entries in your package.json's dependencies (and/or devDependencies) and then reinstalling them at the npm defaulted version, until they play nice with each other. Stripping away non-essential dependencies and resetting default dependencies should eventually work.
It is NOT recommended to install babel globally. It might be that your IDE has recognized your globally installed package and is going based off of that one. Or what is more likely is that you have have packages that conflict with each other. e.g babel-cli conflicts with #babel/cli
While you can install Babel CLI globally on your machine, it's much better to install it locally project by project.
yarn remove global #babel/cli #babel/core
In project directory...
yarn remove babel-cli
yarn add #babel/cli #babel/core #babel/node --dev
I accidentally had a file called .babelrc in my root directory with the following contents:
{
"presets": ["#babel/preset-env"]
}
After I deleted that file, I no longer got this error when running my gulp command.
Sometimes, you have a local version, so remove it so that the global version is ran:
npm uninstall babel-cli
npm uninstall babel-core
Delete node modules.
Update your devdepdencies to
"devDependencies": {
"#babel/core": "^7.13.10",
"babel-core": "^7.0.0-bridge.0",
........
}
npm install
What is the output of npm ls babel-core?
This was mine, so I removed babel-cli#6.26.0 and babel-register#6.26.0 from package.json, and installed #babel/cli and #babel/register
It might be a good idea to delete your lock file and rebuild it.
Delete node_modules
Update devDependencies to:
"devDependencies": {
"#babel/core": "^7.13.10",
"babel-core": "^7.0.0-bridge.0",
}
Install npm again:
npm install

Resources