For others coming to this issue, please see my comment in https://github.com/babel/babel/issues/6838#issuecomment-345095252
This is a bug
Latest @babel/core with @babel/env doesn't work on windows.
I'm using gulp-babel with simple .babelrc file
{
"presets": [
["@babel/env", {
"targets": {
"browsers": ["last 2 versions", "safari >= 7"]
},
"useBuiltIns": "usage",
"debug": true
}]
]
}
I'm expecting the code to compile (transform) through babel.
Instead I get following error:
bash
Error: Couldn't find preset "@babel/env" relative to directory "PROJECT_DIR"
at PROJECT_DIR\node_modules\babel-core\lib\transformation\file\options\option-manager.js:293:19
at Array.map (native)
at OptionManager.resolvePresets (PROJECT_DIR\node_modules\babel-core\lib\transformation\file\options\option-manager.js:275:20)
at OptionManager.mergePresets (PROJECT_DIR\node_modules\babel-core\lib\transformation\file\options\option-manager.js:264:10)
at OptionManager.mergeOptions (PROJECT_DIR\node_modules\babel-core\lib\transformation\file\options\option-manager.js:249:14)
at OptionManager.init (PROJECT_DIR\node_modules\babel-core\lib\transformation\file\options\option-manager.js:368:12)
at compile (PROJECT_DIR\node_modules\babel-register\lib\node.js:103:45)
at loader (PROJECT_DIR\node_modules\babel-register\lib\node.js:144:14)
at Object.require.extensions.(anonymous function) [as .js] (D:\web\html\stels-html\node_modules\babel-register\lib\node.js:154:7)
at Module.load (module.js:503:32)
If I change @babel/env in .babelrc to @babel/preset-env, I get:
shell
TypeError: Cannot read property 'loose' of undefined (While processing preset: "PROJECT_DIR\\node_modules\\@babel\\preset-env\\lib\\index.js")
at _default (PROJECT_DIR\node_modules\@babel\plugin-transform-modules-commonjs\lib\index.js:19:22)
at Function.memoisePluginContainer (PROJECT_DIR\node_modules\babel-core\lib\transformation\file\options\option-manager.js:113:13)
at Function.normalisePlugin (PROJECT_DIR\node_modules\babel-core\lib\transformation\file\options\option-manager.js:146:32)
at PROJECT_DIR\node_modules\babel-core\lib\transformation\file\options\option-manager.js:184:30
at Array.map (native)
at Function.normalisePlugins (PROJECT_DIR\node_modules\babel-core\lib\transformation\file\options\option-manager.js:158:20)
at OptionManager.mergeOptions (PROJECT_DIR\node_modules\babel-core\lib\transformation\file\options\option-manager.js:234:36)
at PROJECT_DIR\node_modules\babel-core\lib\transformation\file\options\option-manager.js:265:14
at PROJECT_DIR\node_modules\babel-core\lib\transformation\file\options\option-manager.js:323:22
at Array.map (native)
| software | version(s)
| ---------------- | -------
| Babel | 7.0.0-beta.32 (both @babel/core and @babel/env)
| gulp-babel | 8.0.0-beta.0
| node | 8.1.3
| npm | 5.5.1
| Operating System | Windows 10 (1709)
Hey @armpogart! We really appreciate you taking the time to report an issue. The collaborators
on this project attempt to help as many people as possible, but we're a limited number of volunteers,
so it's possible this won't be addressed swiftly.
If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack
community that typically always has someone willing to help. You can sign-up here
for an invite.
Can you share a demo app in github. This is the one I've made and it works fine for me.
@rajzshkr Can't make it work with gulpfile.babel.js to show you minimum repro demo. As soon as I paste my gulpfile.babel.js to your demo I get errors:
Failed to load external module babel-register
Failed to load external module babel-core/register
Failed to load external module babel/register
P.S. I use gulpfile.babel.js to use ES6 syntax there. Everything was working with babel < 7.
And of course I get SyntaxError: Unexpected token import on imports
gulpfile.babel.js
Pretty sure this is hardcoded to babel-register, however that hooks in would need to be updated on the gulp side. Not a bug with babel, just again know this is "beta" which doesn't mean it isn't stable but not all the tools you use will be upgraded. And saying "of course" isn't helping 🙂
Thanks for your answers.
This is minimal demo with gulpfile.babel.js https://github.com/armpogart/gulp-test.
From your comment I understand that the hooks need to be updated on gulp side (or gulp-babel side). So gulpfile.babel.js won't work for now? Yes?
Also the initial error that I get is due to some dependency, I'll update soon the repo with another branch that reproduces the error.
And here is the minimal repo (https://github.com/armpogart/gulp-fail) that fails with the mentioned error, removed all unnecessary files and gulp tasks, didn't delete all npm dependencies as I couldn't isolate the problem to exact dependency, but as you can see in gulpfile that I've removed the usage of all of them except gulp and babel. Just clone the repo, run npm install and gulp.
P.S. Though I still use gulpfile.babel.js, but I get the mentioned error, on your demo if I change to gulpfile.babel.js I get other errors mentioned in https://github.com/babel/babel/issues/6838#issuecomment-344936082
Do I need to open separate issue for gulpfile.babel.js usage?
And I get almost the same error while using rollup with rollup-plugin-babel (Error: Couldn't find preset "@babel/env" relative to directory "PROJECT_DIR") on another repo.
I was getting this with babel-cli v6, upgrading it to 7.0.0-beta.32 worked for me.
If I was to guess, it's an issue that rollup or gulp are somehow using something outdated? They both look like they're using 7.0.0-beta.5.
Note: Trying "presets": ["@babel/preset-env"] got me a series of different errors, which at first seemed like a possible workaround, but following that path was not the right solution.
For users getting this error, it is 100% because something in your build is still running Babel 6. I understand that people want to use the beta, but do remember that we're still beta for a reason. Not all of the tooling integration supports 7.x yet, and a lot of the time if they do, it's via an opt-in @next version on npm, like babelify@next, not the version you'll get installed by default. There also some tools that just don't plan to update yet, like Ava, so on Ava for instance you cannot use babel: "inherit", otherwise it'll load your Babel 7 config in Ava's internal Babel 6 .
Ok, I understand that, let the issue remain still open, I'll check the problem with each release of babel 7 until it's stable. I use it in my dev stack intensively, so I was planning to update to babel 7 (and still plan), will try with each release, and report back if the issue is resolved with stable release. Thanks.
@loganfsmyth 100%? are you sure? I am pretty sure everything in my setup is running babel 7.x
"@babel/core": "^7.0.0-beta.32",
"@babel/preset-env": "^7.0.0-beta.32",
"@babel/preset-react": "^7.0.0-beta.32",
"@babel/preset-typescript": "^7.0.0-beta.32",
*There is no 3rd party library involved. *
{
"babel": "babel src --out-dir dist --extensions '.ts' --copy-files"
}
> babel src --out-dir dist --extensions '.ts' --copy-files
Error: Couldn't find preset "@babel/env" relative to directory "/Users/greada/Documents/workspace/s2/stacked/stacked"
at /Users/greada/.config/yarn/global/node_modules/babel-core/lib/transformation/file/options/option-manager.js:293:19
at Array.map (<anonymous>)
at OptionManager.resolvePresets (/Users/greada/.config/yarn/global/node_modules/babel-core/lib/transformation/file/options/option-manager.js:275:20)
at OptionManager.mergePresets (/Users/greada/.config/yarn/global/node_modules/babel-core/lib/transformation/file/options/option-manager.js:264:10)
at OptionManager.mergeOptions (/Users/greada/.config/yarn/global/node_modules/babel-core/lib/transformation/file/options/option-manager.js:249:14)
at OptionManager.init (/Users/greada/.config/yarn/global/node_modules/babel-core/lib/transformation/file/options/option-manager.js:368:12)
at File.initOptions (/Users/greada/.config/yarn/global/node_modules/babel-core/lib/transformation/file/index.js:212:65)
at new File (/Users/greada/.config/yarn/global/node_modules/babel-core/lib/transformation/file/index.js:135:24)
at Pipeline.transform (/Users/greada/.config/yarn/global/node_modules/babel-core/lib/transformation/pipeline.js:46:16)
at transform (/Users/greada/.config/yarn/global/node_modules/babel-cli/lib/babel/util.js:50:22)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] babel: `babel src --out-dir dist --extensions '.ts' --copy-files`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] babel script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/greada/.npm/_logs/2017-11-30T14_44_03_277Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `npm run babel`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/greada/.npm/_logs/2017-11-30T14_44_03_300Z-debug.log
2017-11-30T14_44_03_300Z-debug.log0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'run', 'build' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
5 info lifecycle [email protected]~prebuild: [email protected]
6 info lifecycle [email protected]~build: [email protected]
7 verbose lifecycle [email protected]~build: unsafe-perm in lifecycle true
8 verbose lifecycle [email protected]~build: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bin:/Users/greada/Documents/workspace/s2/stacked/stacked/node_modules/.bin:/Users/greada/.jenv/bin:/Users/greada/.jenv/shims:/usr/local/sbin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin
9 verbose lifecycle [email protected]~build: CWD: /Users/greada/Documents/workspace/s2/stacked/stacked
10 silly lifecycle [email protected]~build: Args: [ '-c', 'npm run babel' ]
11 silly lifecycle [email protected]~build: Returned: code: 1 signal: null
12 info lifecycle [email protected]~build: Failed to exec build script
13 verbose stack Error: [email protected] build: `npm run babel`
13 verbose stack Exit status 1
13 verbose stack at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:280:16)
13 verbose stack at emitTwo (events.js:126:13)
13 verbose stack at EventEmitter.emit (events.js:214:7)
13 verbose stack at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
13 verbose stack at emitTwo (events.js:126:13)
13 verbose stack at ChildProcess.emit (events.js:214:7)
13 verbose stack at maybeClose (internal/child_process.js:925:16)
13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)
14 verbose pkgid [email protected]
15 verbose cwd /Users/greada/Documents/workspace/s2/stacked/stacked
16 verbose Darwin 16.7.0
17 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "build"
18 verbose node v8.9.1
19 verbose npm v5.5.1
20 error code ELIFECYCLE
21 error errno 1
22 error [email protected] build: `npm run babel`
22 error Exit status 1
23 error Failed at the [email protected] build script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]
@pixelass If you're using the babel command, you'll need "@babel/cli": "^7.0.0-beta.32", too.
Might be relevant: if you are using the register, do "@babel/register" (not "babel-register").
This is a pretty bad issue. I have a library that uses "dependencies": {
"@babel/polyfill": "^7.0.0-beta.34"
},
"devDependencies": {
"@babel/cli": "^7.0.0-beta.34",
"@babel/core": "^7.0.0-beta.32",
"@babel/plugin-transform-react-jsx": "^7.0.0-beta.34",
"@babel/preset-env": "^7.0.0-beta.32",
"@babel/preset-react": "^7.0.0-beta.34",
"@babel/preset-stage-0": "^7.0.0-beta.34",
"babel-jest": "^21.2.0",
"babel-loader": "^8.0.0-beta.0"
and when I npm link this library to another react project (that has babel 6). I get Module build failed: Error: Couldn't find preset "@babel/env" relative to directory (of the library)
@babel/env is of course in the library's node_modules directory.
my .babelrc of the library is {
"presets": [
["@babel/env",
{
"modules": false,
"loose": true
}],
"@babel/preset-stage-0",
"@babel/preset-react"
],
"env": {
"test": {
"presets": [
[
"@babel/env",
{
"modules": "commonjs",
"useBuiltIns": "usage",
"debug": false
}
],
"@babel/preset-stage-0",
"@babel/preset-react",
"jest"
],
"plugins": [
"@babel/transform-es2015-modules-commonjs"
]
}
}
}
Do you do for example, "dev": "BABEL_ENV=test gulp --require @babel/register" and npm run dev?
I've found 2 things: that running from npm finds the modules better, and also more importantly, you can only run a BABEL_ENV that has "modules" set to something other than false., like your "test" env. It won't work on your default env.
This is a pain, because we want webpack, not babel, to handle the modules in our project's entry scripts, but we want don't want webpack to handle the gulpfile.babel.js itself.
I think that this is tripping up a lot of people, and available recipes/guides don't explain the nuances particularly well. I'm still wrapping my head around it...
to build my library I run a script that does./node_modules/.bin/webpack -p --env production and ./node_modules/.bin/babel src --ignore node_modules,__tests__ --out-dir dist" I'm not using gulp.
npm run build
@KaboomFox Normally the expectation is that things in node_modules are compiled ahead of time. We're in the process of making this type of workflow easier for 7.x, but it's definitely hard to do currently. I agree it's a rough case though.
It is working for me with @babel/preset-env
Have the same issue
"devDependencies": {
"@babel/cli": "^7.0.0-beta.35",
"@babel/core": "^7.0.0-beta.35",
"@babel/preset-env": "^7.0.0-beta.35",
"aws-sdk": "2.172.0",
"babel-loader": "8.0.0-beta.0",
"body-parser": "1.18.2",
"cors": "2.8.4",
"imports-loader": "0.7.1",
"prettier": "1.9.2",
"serverless": "^1.24.1",
"serverless-offline": "3.16.0",
"serverless-plugin-warmup": "3.3.0-rc.1",
"serverless-webpack": "4.1.0",
"webpack": "3.10.0",
"webpack-node-externals": "1.6.0"
},
"babel": {
"presets": [
[
"@babel/env",
{
"targets": {
"node": "6.10"
},
"shippedProposals": true
}
]
]
},
"stackTrace":["Error: Couldn't find preset \"@babel/env\" relative to directory \"C:\\\\Users\\\\Skaronator\\\\Documents\\\\GitHub\\\\HHB-Backend\"","at C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\babel-core\\lib\\transformation\\file\\options\\option-manager.js:293:19","at Array.map (<anonymous>)","at OptionManager.resolvePresets (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\babel-core\\lib\\transformation\\file\\options\\option-manager.js:275:20)","at OptionManager.mergePresets (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\babel-core\\lib\\transformation\\file\\options\\option-manager.js:264:10)","at OptionManager.mergeOptions (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\babel-core\\lib\\transformation\\file\\options\\option-manager.js:249:14)","at OptionManager.init (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\babel-core\\lib\\transformation\\file\\options\\option-manager.js:368:12)","at compile (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\babel-register\\lib\\node.js:103:45)","at loader (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\babel-register\\lib\\node.js:144:14)","at Object.require.extensions.(anonymous function) [as .js] (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\babel-register\\lib\\node.js:154:7)","at Module.load (module.js:554:32)","at tryModuleLoad (module.js:497:12)","at Function.Module._load (module.js:489:3)","at Module.require (module.js:579:17)","at require (internal/module.js:11:18)","at Object.createHandler (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\serverless-offline\\src\\functionHelper.js:35:21)","at handler (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\serverless-offline\\src\\index.js:499:40)","at Object.internals.handler (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\handler.js:96:36)","at request._protect.run (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\handler.js:30:23)","at module.exports.internals.Protect.internals.Protect.run (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\protect.js:64:5)","at exports.execute (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\handler.js:24:22)","at each (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\request.js:384:16)","at iterate (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\items\\lib\\index.js:36:13)","at done (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\items\\lib\\index.js:28:25)","at module.exports.internals.Auth.internals.Auth._authenticate (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\auth.js:210:16)","at internals.Auth.authenticate (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\auth.js:202:17)","at each (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\request.js:384:16)","at iterate (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\items\\lib\\index.js:36:13)","at done (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\items\\lib\\index.js:28:25)","at request.connection.states.parse (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\route.js:379:20)","at Items.serial (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\statehood\\lib\\index.js:244:16)","at done (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\items\\lib\\index.js:31:25)","at Items.serial (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\statehood\\lib\\index.js:184:20)","at iterate (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\items\\lib\\index.js:36:13)","at Object.exports.serial (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\items\\lib\\index.js:39:9)","at exports.Definitions.internals.Definitions.internals.Definitions.parse (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\statehood\\lib\\index.js:158:11)","at internals.state (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\route.js:360:31)","at each (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\request.js:384:16)","at iterate (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\items\\lib\\index.js:36:13)","at Object.exports.serial (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\items\\lib\\index.js:39:9)","at internals.Request._lifecycle (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\request.js:387:11)","at internals.Request._execute (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\request.js:302:21)","at Domain.request._protect.enter (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\connection.js:261:25)","at Domain.run (domain.js:242:14)","at module.exports.internals.Protect.internals.Protect.enter (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\protect.js:80:17)","at Server.<anonymous> (C:\\Users\\Skaronator\\Documents\\GitHub\\HHB-Backend\\node_modules\\hapi\\lib\\connection.js:259:30)","at emitTwo (events.js:126:13)","at Server.emit (events.js:214:7)","at parserOnIncoming (_http_server.js:602:12)"]
@Skaronator Your stack trace mentions serverless-offline which enables babel-register if you tell it to, so that would appear to be loading Babel 6, causing your issue.
Oh damn! Feeling like a idiot now. Removed those lines from my serverless config and now everything just works! Thanks
- babelOptions:
- presets: ["es2015", "stage-2"]
changed the babel config to
options: {presets: ['env']}
I had this issue trying to run a script within a Lerna package.
In that case, I had installed all the babel packages with lerna bootstrap command.
I solved it by re-installing with yarn add from within the sub package i am writing
In my case it seemed to be related to having babel@6 as a global node_module and therefore as a global bin.
I'm not sure if or why that was the reason but once i removed it all other problems resolved.
Hey, thanks for the note. I should have mentioned, I am using babel 7 beta 44. it is installed in the local folder of the package in the lerna project
I'm having this issue, and I've been trying to chip at it for an hour. Here's the stuff:
Dependencies:
"@babel/cli": "^7.0.0-beta.47",
"@babel/core": "^7.0.0-beta.47",
"@babel/preset-env": "^7.0.0-beta.47",
"ajv": "^6.5.0",
"babel-loader": "^7.1.4",
"babel-webpack-plugin": "^0.1.1",
"html-webpack-plugin": "^3.2.0",
"http-server": "^0.11.1",
"jasmine-core": "^3.1.0",
"karma": "^2.0.2",
"karma-chrome-launcher": "^2.2.0",
"karma-jasmine": "^1.1.2",
"protractor": "^5.3.2",
"webpack": "^4.8.3",
"webpack-cli": "^2.1.3"
.babelrc:
{
"presets": ["env"]
}
Error:
Error: Couldn't find preset "env" relative to directory "{path to project}"
at {path to project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:293:19
at Array.map (<anonymous>)
at OptionManager.resolvePresets ({path to project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:275:20)
at OptionManager.mergePresets ({path to project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:264:10)
at OptionManager.mergeOptions ({path to project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:249:14)
at OptionManager.init ({path to project}/node_modules/babel-core/lib/transformation/file/options/option-manager.js:368:12)
at File.initOptions ({path to project}/node_modules/babel-core/lib/transformation/file/index.js:212:65)
at new File ({path to project}/node_modules/babel-core/lib/transformation/file/index.js:135:24)
at Pipeline.transform ({path to project}/node_modules/babel-core/lib/transformation/pipeline.js:46:16)
at files.forEach ({path to project}/node_modules/babel-webpack-plugin/index.js:60:28)
at Array.forEach (<anonymous>)
at compilation.plugin ({path to project}/node_modules/babel-webpack-plugin/index.js:32:11)
at AsyncSeriesHook.eval [as callAsync] (eval at create ({path to project}/node_modules/tapable/lib/HookCodeFactory.js:24:12), <anonymous>:7:1)
at AsyncSeriesHook.lazyCompileHook [as _callAsync] ({path to project}/node_modules/tapable/lib/Hook.js:35:21)
at hooks.additionalAssets.callAsync.err ({path to project}/node_modules/webpack/lib/Compilation.js:952:36)
at AsyncSeriesHook.eval [as callAsync] (eval at create ({path to project}/node_modules/tapable/lib/HookCodeFactory.js:24:12), <anonymous>:6:1)
at AsyncSeriesHook.lazyCompileHook [as _callAsync] ({path to project}/node_modules/tapable/lib/Hook.js:35:21)
at hooks.optimizeTree.callAsync.err ({path to project}/node_modules/webpack/lib/Compilation.js:948:32)
at AsyncSeriesHook.eval [as callAsync] (eval at create ({path to project}/node_modules/tapable/lib/HookCodeFactory.js:24:12), <anonymous>:6:1)
at AsyncSeriesHook.lazyCompileHook [as _callAsync] ({path to project}/node_modules/tapable/lib/Hook.js:35:21)
at Compilation.seal ({path to project}/node_modules/webpack/lib/Compilation.js:890:27)
at hooks.make.callAsync.err ({path to project}/node_modules/webpack/lib/Compiler.js:481:17)
at _done (eval at create ({path to project}/node_modules/tapable/lib/HookCodeFactory.js:24:12), <anonymous>:9:1)
at _err0 (eval at create ({path to project}/node_modules/tapable/lib/HookCodeFactory.js:24:12), <anonymous>:20:22)
at childCompiler.compileTemplate.catch.then.compilationResult ({path to project}/node_modules/html-webpack-plugin/index.js:84:11)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:188:7)
@with-a-k
{
"presets": ["env"]
}
should be
{
"presets": ["@babel/preset-env"] // or @babel/env
}
I am creating a Vue and hapi.js project. I am using Webpack as my bundler and nodemon to watch server changes with the babel-node command. I got this same error when I tried to install and configure highcharts-vue: Couldn't find preset "@babel/env" relative to directory.
This is what I had to do to get things working again:
Install these packages:
yarn add @babel/cli @babel/core @babel/preset-env @babel/node babel-cli@next babel-core@next babel-preset-env@next babel-loader@next
NOTE: Make sure that you do not have @babel/plugin-transform-runtime installed. That gave me a huge console error.
Then in your .babelrc file, change this:
{
"presets": ["env"]
}
To this:
{
"presets": ["@babel/env"]
}
It seems strange to me that I should have two versions of Babel installed for many of those packages, but I kept getting errors when I tried to uninstall one version or the other. I would like to understand why that is, so if someone knows please tell me.
Also, I was using babel-polyfill at the top of my server.js file (for hapi.js) so I could use ES6 imports and exports. After making the above changes, I kept getting the following server error: Error: only one instance of babel/polyfill is allowed. I commented out the babel-polyfill import and then I got errors related to the ES6 imports/exports. I could not figure out how to fix the only one instance of babel/polyfill is allowed error, so I removed the import "babel-polyfill" at the top of my server.js file and switched all of my imports/exports back to CommonJS syntax (e.g., require("moduleName"), module.exports = {}) and that fixed my problems.
I hope this helps!
I have some updates that might help to explain some things.
I think what is going on here is that you have to upgrade every npm package that is related to babel to at least version 7.0.0 (or at least as many packages as can be upgraded). However, the Babel 7.X.X versions (and beyond) use the newer namespaced versions (e.g., @babel/cli as opposed to babel-cli). This will require a few tweaks in some of your config files, like .babelrc (as I explained above). Many of the namespaced versions are already set to version 7.0.0 or higher, although some of those packages might still be in beta. The beta versions should be fine, though.
NOTE: Some Babel packages might not have a newer namespaced version, so you will have to do some research on how to use those older packages correctly.
After finding out which Babel packages have namespaced versions, remove the old packages like this:
yarn remove babel-cli
...and replace them with the new packages like this:
yarn add @babel/cli
NOTE: Some of the older versions that don't yet have a newer, namespaced version can be installed like this:
yarn add babel-cli@^7.0.0
If you install an older version like that, then you might be asked to select a version. If so, just select the latest version from the list, even if it is a beta version.
Additional Notes:
babel-node command in your npm scripts for dev and production builds of a Node.js server: In Babel 7, the babel-node command comes from @babel/node instead of babel-cli. See the Upgrade to Babel 7 guide.@babel/polyfill at the top of your server.js file, but you might have to use it like this to prevent build errors:if (env === "production") {
require("@babel/polyfill");
}
trying to do the list of npm installs from above on ubuntu raises the issue: npm install 'babel-loader' drags in dependence [email protected] which then causes error
-- RESOLVED --
by installing : [email protected]
by removing : babel-core
173:20 error Module build failed (from ./node_modules/babel-loader/lib/index.js):
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
````
``
"@babel/core": "^7.0.0-rc.1",
"@babel/preset-env": "^7.0.0-rc.1",
"babel-loader": "^7.1.5",
"babel-preset-es2015": "^6.24.1",
"babel-register": "^6.26.0",
"babelify": "^8.0.0",
"gulp-babel": "^7.0.0",
"babel-preset-env": "^1.7.0",
"babelify": "^8.0.0",
very similar to this
@rowntreerob You need to use the beta version of babel-loader for Babel 7.x support.
I am creating a Vue and hapi.js project. I am using Webpack as my bundler and nodemon to watch server changes with the babel-node command. I got this same error when I tried to install and configure highcharts-vue:
Couldn't find preset "@babel/env" relative to directory.This is what I had to do to get things working again:
Install these packages:
yarn add @babel/cli @babel/core @babel/preset-env @babel/node babel-cli@next babel-core@next babel-preset-env@next babel-loader@next --devNOTE: Make sure that you do not have
@babel/plugin-transform-runtimeinstalled. That gave me a huge console error.Then in your
.babelrcfile, change this:{ "presets": ["env"] }To this:
{ "presets": ["@babel/env"] }It seems strange to me that I should have two versions of Babel installed for many of those packages, but I kept getting errors when I tried to uninstall one version or the other. I would like to understand why that is, so if someone knows please tell me.
Also, I was using
babel-polyfillat the top of myserver.jsfile (for hapi.js) so I could use ES6 imports and exports. After making the above changes, I kept getting the following server error:Error: only one instance of babel/polyfill is allowed. I commented out thebabel-polyfillimport and then I got errors related to the ES6 imports/exports. I could not figure out how to fix theonly one instance of babel/polyfill is allowederror, so I removed theimport "babel-polyfill"at the top of myserver.jsfile and switched all of my imports/exports back to CommonJS syntax (e.g.,require("moduleName"),module.exports = {}) and that fixed my problems.I hope this helps!
I tried several ways to solve it and it definitely saved everything!
Thanks dude!
I am creating a Vue and hapi.js project. I am using Webpack as my bundler and nodemon to watch server changes with the babel-node command. I got this same error when I tried to install and configure highcharts-vue:
Couldn't find preset "@babel/env" relative to directory.This is what I had to do to get things working again:
Install these packages:
yarn add @babel/cli @babel/core @babel/preset-env @babel/node babel-cli@next babel-core@next babel-preset-env@next babel-loader@next --devNOTE: Make sure that you do not have
@babel/plugin-transform-runtimeinstalled. That gave me a huge console error.Then in your
.babelrcfile, change this:{ "presets": ["env"] }To this:
{ "presets": ["@babel/env"] }It seems strange to me that I should have two versions of Babel installed for many of those packages, but I kept getting errors when I tried to uninstall one version or the other. I would like to understand why that is, so if someone knows please tell me.
Also, I was using
babel-polyfillat the top of myserver.jsfile (for hapi.js) so I could use ES6 imports and exports. After making the above changes, I kept getting the following server error:Error: only one instance of babel/polyfill is allowed. I commented out thebabel-polyfillimport and then I got errors related to the ES6 imports/exports. I could not figure out how to fix theonly one instance of babel/polyfill is allowederror, so I removed theimport "babel-polyfill"at the top of myserver.jsfile and switched all of my imports/exports back to CommonJS syntax (e.g.,require("moduleName"),module.exports = {}) and that fixed my problems.I hope this helps!
This help me a lot. Thank you man. :+1:
Most helpful comment
changed the babel config to
options: {presets: ['env']}