Each time the project needs to be built the Circle CI fails. However, when it gets rebuilt as "Rebuild without Cache" it passes.
It gets really annoying to have to rerun it each time manually.
> escrow#0.0.1 bundle /home/ubuntu/escrow
> node node_modules/react-native/local-cli/cli.js bundle --entry-file index.ios.js --bundle-output iOS/main.jsbundle
/home/ubuntu/escrow/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:193
throw new ReferenceError(messages.get("pluginUnknown", plugin, loc, i, dirname));
^
ReferenceError: Unknown plugin "transform-es2015-arrow-functions" specified in "/home/ubuntu/escrow/.babelrc" at 2, attempted to resolve relative to "/home/ubuntu/escrow"
at /home/ubuntu/escrow/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:193:17
at Array.map (native)
at Function.normalisePlugins (/home/ubuntu/escrow/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:173:20)
at OptionManager.mergeOptions (/home/ubuntu/escrow/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:271:36)
at OptionManager.addConfig (/home/ubuntu/escrow/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:221:10)
at OptionManager.findConfigs (/home/ubuntu/escrow/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:364:16)
at OptionManager.init (/home/ubuntu/escrow/node_modules/react-native/node_modules/babel-core/lib/transformation/file/options/option-manager.js:412:12)
at compile (/home/ubuntu/escrow/node_modules/react-native/node_modules/babel-register/lib/node.js:87:26)
at loader (/home/ubuntu/escrow/node_modules/react-native/node_modules/babel-register/lib/node.js:130:14)
at Object.require.extensions.(anonymous function) [as .js] (/home/ubuntu/escrow/node_modules/react-native/node_modules/babel-register/lib/node.js:140:7)
.babelrc:
{
"presets": [
"react-native",
],
"plugins": [
//Needed for redux.
"babel-plugin-transform-decorators-legacy",
"transform-class-properties", //this needs to be at top /shrug
// es2015 preset (except transform-es2015-typeof-symbol which caused problem)
"transform-es2015-arrow-functions",
"transform-es2015-block-scoped-functions",
"transform-es2015-block-scoping",
"transform-es2015-classes",
"transform-es2015-computed-properties",
"transform-es2015-constants",
"transform-es2015-destructuring",
"transform-es2015-for-of",
"transform-es2015-function-name",
"transform-es2015-literals",
"transform-es2015-object-super",
"transform-es2015-parameters",
"transform-es2015-shorthand-properties",
"transform-es2015-spread",
"transform-es2015-sticky-regex",
"transform-es2015-template-literals",
"transform-es2015-unicode-regex",
// stage-1 preset
"transform-async-to-generator",
"transform-exponentiation-operator",
"syntax-trailing-function-commas",
"transform-object-rest-spread",
"transform-class-constructor-call",
"transform-decorators",
"transform-export-extensions",
]
}
Related
I'm trying to set up a react native project inside a yarn workspace and got Android running by preceding all node_modules references in .gradle files with ../ to reference node_modules in the workspace folder.
But that didn't work in iOS and later I heard it's better to do the nohoist and I tried adding the following in my react native project `package.json
private: true,
"workspaces": {
"nohoist": [
"**"
]
}
Or
private: true,
"workspaces": {
"nohoist": [
"react-native",
"react-native/**",
"react",
"react/**"
]
}
But in both case, I'm getting the following error,
Unhandled JS exception: Unexpected keyword 'export'
More details: Fresh project created with react-native init
react-native: 0.63.4
react: 16.13.1
linter and linter-eslint modules are installed in Atom
Create a react native project
react-native init AwesomeApp
Install requisite node modules
yarn add babel-eslint eslint-config-airbnb-base eslint-plugin-react eslint-plugin-react-native --dev
Create .eslintrc file:
{
"parser": "babel-eslint",
"plugins": [
"react",
"react-native"
],
"parserOptions": {
"ecmaFeatures": {
"jsx": true,
"modules": true
}
},
"extends" : [
"eslint:recommended",
"plugin:react/recommended",
"airbnb-base"
],
"rules" : {
"arrow-body-style" : 'warn'
}
}
When I open Atom I get an error
Here is the stack trace from the dev tools:
/Volumes/Macintosh HD 3/.atom/packages/linter/lib/linter-registry.js:159 [Linter] Error running ESLint Error: Failed to load plugin react-native: Cannot find module 'eslint-plugin-react-native'
at Function.Module._resolveFilename (module.js:455:15)
at Function.resolve (internal/module.js:27:19)
at Object.load (/Volumes/Macintosh HD 3/.atom/packages/linter-eslint/node_modules/eslint/lib/config/plugins.js:134:29)
at Array.forEach (native)
at Object.loadAll (/Volumes/Macintosh HD 3/.atom/packages/linter-eslint/node_modules/eslint/lib/config/plugins.js:162:21)
at Object.load (/Volumes/Macintosh HD 3/.atom/packages/linter-eslint/node_modules/eslint/lib/config/config-file.js:541:21)
at loadConfig (/Volumes/Macintosh HD 3/.atom/packages/linter-eslint/node_modules/eslint/lib/config.js:63:33)
at new Config (/Volumes/Macintosh HD 3/.atom/packages/linter-eslint/node_modules/eslint/lib/config.js:229:42)
at CLIEngine.executeOnText (/Volumes/Macintosh HD 3/.atom/packages/linter-eslint/node_modules/eslint/lib/cli-engine.js:741:28)
at lintJob (/Volumes/Macintosh HD 3/.atom/packages/linter-eslint/lib/worker.js:50:51)
Atom is up to date, I'm running 1.18.0 x64
eslint-plugin-react-native is definitely installed within the project. Any ideas what I'm missing?
For me, removing this line worked:
"parser": "babel-eslint",
I've installed the third party library https://www.npmjs.com/package/scroll-into-view into my Aurelia CLI project using:
npm install --save scroll-into-view
I've added the following to the dependencies array in aurelia.json:
{
"name": "scroll-into-view",
"path": "../node_modules/scroll-into-view",
"main": "scrollIntoView"
}
I've added the following to the component I want to make use of the library:
import * as scrollIntoView from "scroll-into-view";
When I execute au run --watch I receive a long list of errors, repeating a version of the following:
Error: ENOENT: no such file or directory, open 'C:\src\choiceswizard\src\node_modules\raf.js'
at Object.fs.openSync (fs.js:558:18)
at Object.fs.readFileSync (fs.js:468:33)
at Object.exports.readFileSync (C:\src\choiceswizard\node_modules\aurelia-cli\lib\file-system.js:49:13)
at fileRead (C:\src\choiceswizard\node_modules\aurelia-cli\lib\build\bundled-source.js:83:31)
at Object.context.fileRead (C:\src\choiceswizard\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:176:18)
at Object.context.load (C:\src\choiceswizard\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:357:30)
at Module.load (eval at <anonymous> (C:\src\choiceswizard\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:1), <anonymous>:832:29)
at Module.fetch (eval at <anonymous> (C:\src\choiceswizard\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:1), <anonymous>:822:66)
at Module.check (eval at <anonymous> (C:\src\choiceswizard\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:1), <anonymous>:854:30)
at Module.enable (eval at <anonymous> (C:\src\choiceswizard\node_modules\aurelia-cli\lib\build\amodro-trace\lib\loader\Loader.js:14:1), <anonymous>:1173:22)
errno: -4058,
code: 'ENOENT',
syscall: 'open',
path: 'C:\\src\\choiceswizard\\src\\node_modules\\raf.js',
moduleTree: [ 'scroll-into-view/scrollIntoView' ],
fileName: 'C:/src/choiceswizard/node_modules/scroll-into-view/scrollIntoView.js'
This informed me that scroll-into-view has a dependency on raf https://www.npmjs.com/package/raf while raf has its own dependencies and likely so-on.
Notice that the dependencies are being looked for in root of the C:\src\choiceswizard\src\node_modules\ folder and not in the individual module folders e.g. C:\src\choiceswizard\src\node_modules\raf.
Also, upon further experimentation I discovered that raf uses index.js as its entry-point and as such what appears to be an assumption being made that raf.js is the name of the file is incorrect.
It seems to me like Aurelia CLI is not parsing the package.json of each dependency in the hierarchy and loading them accordingly. I could also be horribly misunderstanding the issue.
Does anyone have any insight that might help me use scroll-into-view in my project?
This package has a dependency which itself has a dependency.
Add the following to the dependencies section of the vendor-bundle config in your aurelia.json file and you'll be good to go:
"performance-now",
"raf",
"scroll-into-view"
I am trying to start a new react-native project following the Getting Started example in the projects docs. Below is the install and error I get. NODE is 5.2, NPM is 3.3.12. Mac is El Capitain.
I get an error: Error: Couldn't find preset "es2015" relative to directory referencing ES2015 relative to directory.
I then follow the advice here and have both presets installed globally and locally in the project. You can see it in the npm ls -g command below that its installed globally. After installing it locally in the project, i get a peer deependency warning for react: UNMET PEER DEPENDENCY react#15.0.2
I then installed react#15.0.2. I then re-run react-native run-ios and I get the same error:
Alains-MacBook-Pro:AwesomeProject klik$ react-native run-ios
/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:413
throw new Error( /*istanbul ignore next*/"Couldn't find preset " + /*istanbul ignore next*/(0, _stringify2.default)(val) + " relative to directory " + /*istanbul ignore next*/(0, _stringify2.default)(dirname));
^
Error: Couldn't find preset "es2015" relative to directory "/Users/klik"
at /Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:413:17
at Array.map (native)
I then run npm install on the project and get the same error again.
Alains-MacBook-Pro:AwesomeProject klik$ npm -v
3.3.12
Alains-MacBook-Pro:AwesomeProject klik$ npm install
Alains-MacBook-Pro:AwesomeProject klik$ react-native run-ios
/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:413
throw new Error( /*istanbul ignore next*/"Couldn't find preset " + /*istanbul ignore next*/(0, _stringify2.default)(val) + " relative to directory " + /*istanbul ignore next*/(0, _stringify2.default)(dirname));
^
Error: Couldn't find preset "es2015" relative to directory "/Users/klik"
at /Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:413:17
at Array.map (native)
at OptionManager.resolvePresets (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:405:20)
at OptionManager.mergePresets (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:388:10)
at OptionManager.mergeOptions (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:347:14)
at OptionManager.addConfig (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:248:10)
at OptionManager.findConfigs (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:454:16)
at OptionManager.init (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:502:12)
at compile (/Users/klik/projects/AwesomeProject/node_modules/babel-register/lib/node.js:112:69)
at loader (/Users/klik/projects/AwesomeProject/node_modules/babel-register/lib/node.js:158:14)
I then add a .babelrc file with the following JSON. This has worked on other projects for me after reading it on Babeljs.io and I saw it suggested here again so I tried it. It didnt work but produced this different error referencing the promise directory. This looks like it waiting for a promise to return with the ios file in the project, which doesnt exist because React-Native never completed the install. All I have for files in the project after running npm install are node_modules directory and package.json and the .babelrc file I added:
Alains-MacBook-Pro:AwesomeProject klik$ npm install
Alains-MacBook-Pro:AwesomeProject klik$ react-native run-ios
/Users/klik/projects/AwesomeProject/node_modules/promise/lib/done.js:10
throw err;
^
Error: ENOENT: no such file or directory, uv_chdir
at Error (native)
at process.chdir (/Users/klik/projects/AwesomeProject/node_modules/graceful-fs/polyfills.js:18:9)
at _runIOS (runIOS.js:51:11)
at runIOS.js:24:5
at tryCallTwo (/Users/klik/projects/AwesomeProject/node_modules/promise/lib/core.js:45:5)
at doResolve (/Users/klik/projects/AwesomeProject/node_modules/promise/lib/core.js:200:13)
at new Promise (/Users/klik/projects/AwesomeProject/node_modules/promise/lib/core.js:66:3)
at Array.runIOS (runIOS.js:23:10)
at Object.run (/Users/klik/projects/AwesomeProject/node_modules/react-native/local-cli/cli.js:87:13)
at Object.<anonymous> (/Users/klik/.nvm/versions/node/v5.2.0/lib/node_modules/react-native-cli/index.js:88:7)
This is the original install with error:
Alains-MacBook-Pro:~ klik$ npm ls -g --depth=0
/Users/klik/.nvm/versions/node/v5.2.0/lib
├── babel-cli#6.8.0
├── babel-preset-es2015#6.6.0
├── babel-preset-react#6.5.0
├── cf-package#1.0.2
├── eslint#2.10.2
├── express#4.13.4
├── firebase-tools#3.0.0
├── gulp-cli#1.2.1
├── jshint#2.9.2
├── node-pre-gyp#0.6.28
├── nodemon#1.9.2
├── npm#3.3.12
├── react-native-cli#0.2.0
├── reindex-cli#0.4.1
├── rnpm#1.7.0
├── webpack#1.13.0
└── webpack-dev-server#1.14.1
Alains-MacBook-Pro:~ klik$ which node
**/Users/klik/.nvm/versions/node/v5.2.0/bin/node**
Alains-MacBook-Pro:~ klik$ which npm
**/Users/klik/.nvm/versions/node/v5.2.0/bin/npm**
Alains-MacBook-Pro:~ klik$ watchman -v
4.5.0
Alains-MacBook-Pro:~ klik$ cd projects
Alains-MacBook-Pro:projects klik$ react-native init AwesomeProject
This will walk you through creating a new React Native project in /Users/klik/projects/AwesomeProject
Installing react-native package from npm...
/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:413
throw new Error( /*istanbul ignore next*/"Couldn't find preset " + /*istanbul ignore next*/(0, _stringify2.default)(val) + " relative to directory " + /*istanbul ignore next*/(0, _stringify2.default)(dirname));
^
Error: Couldn't find preset "es2015" relative to directory "/Users/klik"
at /Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:413:17
at Array.map (native)
at OptionManager.resolvePresets (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:405:20)
at OptionManager.mergePresets (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:388:10)
at OptionManager.mergeOptions (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:347:14)
at OptionManager.addConfig (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:248:10)
at OptionManager.findConfigs (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:454:16)
at OptionManager.init (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:502:12)
at compile (/Users/klik/projects/AwesomeProject/node_modules/babel-register/lib/node.js:112:69)
at loader (/Users/klik/projects/AwesomeProject/node_modules/babel-register/lib/node.js:158:14)
Alains-MacBook-Pro:projects klik$
Any ideas come to mind? Thank you in advance for your help.
tl;dr.
npm i babel-preset-react-native --save-dev
$ echo '{"presets": ["react-native"]}' > .babelrc
So the problem as noted in the first error starts in the babel options manager:
at OptionManager.init (/Users/klik/projects/AwesomeProject/node_modules/babel-core/lib/transformation/file/options/option-manager.js:502:12)
While trying to figure out how to get any react-native project running, I came across Este's DevStack for react-native. When I installed, it worked as advertised. I went to the code to see why this worked and not one single other worked. Este has a .babelrc file. This is it:
Este .babelrc
{
"presets": ["react-native"],
"env": {
"production": {
"plugins": [
"transform-react-constant-elements",
"transform-react-inline-elements"
]
}
}
}
I added the "env" setting to the .babelrc i created earlier. This is the current .babelrc file.
{
"retainLines": true,
"compact": true,
"comments": false,
"plugins": [],
"presets": ["react", "react-native"],
"env": {
"plugins": [
"transform-react-constant-elements",
"transform-react-inline-elements"
]
},
"sourceMaps": false,
}
I added this options configuration into each previous project including the one that is the subject of the question and everyone of them worked. This includes the Firebase, example. They all worked. Apparently, Babel 6 no longer does transforms by default and you have to enable it. I checked the React-Native Babel Preset on github and it handles transforms. So this is the new .babelrc file and it works.
{"presets": ["react-native"]}
Turns out #jaxoncreed has the right solution in his question here. The answer there suggests there is a default fallback .babelrc file that will be used if you put one in. In the copy of the the tutorial project downloaded a few days ago, that file doesn't exist. So the short answer is I need to add the .babelrc file in the project.
npm i babel-preset-react-native --save-dev
$ echo '{"presets": ["react-native"]}' > .babelrc
I'm getting the following error upon running react-native init testNative
ReferenceError: [BABEL] /Users/m/git/testNative/node_modules/react-native/local-cli/bundle/bundle.js: Unknown option: base.optional
at Logger.error (/Users/m/git/testNative/node_modules/babel-core/lib/transformation/file/logger.js:41:11)
at OptionManager.mergeOptions (/Users/m/git/testNative/node_modules/babel-core/lib/transformation/file/options/option-manager.js:289:18)
at OptionManager.init (/Users/m/git/testNative/node_modules/babel-core/lib/transformation/file/options/option-manager.js:486:10)
at File.initOptions (/Users/m/git/testNative/node_modules/babel-core/lib/transformation/file/index.js:211:75)
at new File (/Users/m/git/testNative/node_modules/babel-core/lib/transformation/file/index.js:129:22)
at Pipeline.transform (/Users/m/git/testNative/node_modules/babel-core/lib/transformation/pipeline.js:48:16)
at Object.transformFileSync (/Users/m/git/testNative/node_modules/babel-core/lib/api/node.js:118:10)
at compile (/Users/m/git/testNative/node_modules/babel-register/lib/node.js:100:20)
at loader (/Users/m/git/testNative/node_modules/babel-register/lib/node.js:128:14)
at Object.require.extensions.(anonymous function) [as .js] (/Users/m/git/testNative/node_modules/babel-register/lib/node.js:138:7)
I've tried the advice in the following posts (https://github.com/facebook/react-native/issues/5, https://github.com/babel/babel-loader/issues/132, https://github.com/babel/babelify/issues/129, React 0.14 error: Module build failed: ReferenceError: [BABEL] .../node_modules/eslint-loader/index.js!/.../main.jsx: Unknown option: base.stage), but with no avail.
My current hypothesis is that because I don't have a .babelrc file anywhere on my system, it's falling back to "base.optional." At least adding a .babelrc file to my project folder is the only thing that yielded a different outcome (downgrading node, babel, or react-native did nothing). So, if this is the solution, does anyone know what my .babelrc file should include for a react-native project?
Thanks
Here is one of the .babelrc files that you can use with your RN project.
Note that RN works fine with no .babelrc file in your project (it falls back to node_modules/react-native/.babelrc file.
{
"retainLines": true,
"compact": true,
"comments": false,
"plugins": [],
"presets": ["stage-0", "react", "react-native"],
"sourceMaps": false,
}
You also need to add these line to your package.json file and install the dev-dependencies : npm i --save-dev <package-name>
"devDependencies": {
"babel-preset-react": "^6.3.13",
"babel-preset-react-native": "^1.4.0",
"babel-preset-stage-0": "^6.3.13"
}