Route not found in react-router-native when using eslint - react-native

I have the following in my js file:
import { NativeRouter, Route, Link } from 'react-router-native'
When running eslint I get the following error:
error Route not found in 'react-router-native' import/named
However my application runs perfectly fine, I just get the error when I'm running eslint. Why is this?
From package.json:
"eslint": "^4.15.0",
"eslint-config-airbnb": "^16.1.0",
"eslint-config-react-native": "^2.0.0",
"eslint-plugin-import": "^2.8.0",
"eslint-plugin-jsx-a11y": "^6.0.3",
"eslint-plugin-react": "^7.5.1",
"eslint-plugin-react-native": "^3.2.1",
"react-router": "^4.2.0",
"react-router-dom": "^4.2.2",
"react-router-native": "^4.2.0",

Looks like eslint is reporting correctly. I no longer get an error after changing my js to:
import { NativeRouter, Link } from 'react-router-native'
import { Route } from 'react-router'
The rule says that all named imports must be part of the set of named exports: https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/named.md
react-router-native is re-exporting Route from react-router, but it isn't named when re-exported from
react-router-native. At least that's my understanding.

Related

npm run watch Error in Cannot read property of 'map' undefined

Problem:
Running the command npm run watch throws and error
54% building 35/41 modules 6 active /app/docroot/themes/custom/mytheme/node_modules/css-loader/index.js??ref--10-2!/app/docroot/themes/custom/mytheme/node_modules/postcss-loader/src/index.js??postcss5!/app/docroot/themes
ERROR Failed to compile with 1 errors 1:25:50 AM
error
Cannot read property 'map' of undefined
15 assets
ERROR in Cannot read property 'map' of undefined
[Browsersync] Proxying: https://ps.lndo.site
The Error happens only when the following code is included in my webpack.mix.js file:
mix.imagemin({
patterns: [{
from: '**/*.{png,gif,jpg,jpeg,svg}',
to: 'images/',
context: 'src/images/'
}, {
from: '**/*.{png,gif,jpg,jpeg,svg}',
to: 'images/',
context: 'src/components/'
}]
});
Removing the above snippet removes the error but the previous developers on this project had this for a reason.
I recently updated due to security vulnerabilities and managed to debug a different issue that Copy Plugin introduced a breaking change (already updated in the code above). However I am unsure that I have all of the configuration correct.
This I have tried:
From the command line
rm -rf node_modules
rm package.lock
npm cache clean --force
npm install
These are the packages in package.json current as of August 27, 2020
"devDependencies": {
"bootstrap": "^4.3.1",
"browser-sync": "^2.26.12",
"browser-sync-webpack-plugin": "^2.2.2",
"copy-webpack-plugin": "^6.0.3",
"cross-env": "^7.0.2",
"husky": "^4.2.5",
"imagemin-webpack-plugin": "^2.4.2",
"jquery": "^3.5.1",
"laravel-mix": "^5.0.4",
"laravel-mix-imagemin": "^1.0.3",
"popper.js": "^1.16.1",
"pretty-quick": "^2.0.1",
"resolve-url-loader": "^3.1.1",
"sass": "^1.26.10",
"sass-loader": "^8.0.2",
"vue-template-compiler": "^2.6.11"
},
"dependencies": {
"throttle-debounce": "^2.3.0"
}
The packages updated were the following
"browser-sync": "^2.26.7",
"copy-webpack-plugin": "^5.1.1",
"husky": "^4.2.3",
"jquery": "^3.5.0",
"sass": "^1.26.3",
"throttle-debounce": "^2.1.0"
To me this looks like a bug in the laravel-mix-imagemin plugin. Its NPM page says that "The patterns parameter is automatically converted to an array". But this doesn't comply with the copy-webpack-plugin^6 you are using (which is used under the hood by laravel-mix-imagemin), as version 6 doesn't accept an array anymore. (Too bad the laravel-mix-imagemin plugin doesn't list its dependencies and their versions properly ...)
BTW: I had basically the same issue, and the error message you get is a catastrophe.
You might be having a problem respect of the version of webpack. This is the best guess I can make. If this code worked before, then this could be a possibility.
Did not find a great answer, for now just removed imagemin configuration from webpack mix. Fixes the compile issue but does not resolve my original question.

Getstream Chat Error: AnimatedValue: Attempting to set value to undefined

I am working with Getstream chat SDk in react native,
My package.json file looks like:
"dependencies": {
"#react-native-community/masked-view": "^0.1.10",
"#react-native-community/netinfo": "^5.9.4",
"react": "16.13.1",
"react-native": "0.63.1",
"react-native-device-info": "^5.6.2",
"react-native-document-picker": "^3.5.3",
"react-native-fast-image": "^8.1.5",
"react-native-gesture-handler": "^1.6.1",
"react-native-image-picker": "^2.3.2",
"react-native-safe-area-context": "^3.1.1",
"react-native-screens": "^2.9.0",
"react-navigation": "4.1.0",
"react-navigation-stack": "^2.8.2",
"stream-chat-react-native": "^0.13.1"
},
I am using the same react native code in the "native message example" provided in the link : https://github.com/GetStream/stream-chat-react-native
While running, The chat list screen is presenting , but on selecting a chat it shows an error as :
Error: AnimatedValue: Attempting to set value to undefined
Do anyone has the same issue, Could you please help me to solve this.
Thanks in advance.
TLDR:
Mine working version for 1.3.2,
Please read readme.md and bug.md as walktrough.
https://github.com/ilovejs/ReactNative-GetStream-Bugfix
Explaination:
What are the problems in 'official' demo ?
"react-native-image-picker": "^2.3.4"
index.js introduce patch uuid crpyto bug, that reported in readme.md
"react-native-reanimated": "1.13.1",

Aurelia: History must implement activate()

I'm new to Aurelia, trying to implement some 'simple' dynamic routing with an id.
config.map([
{ route: 'questions/:id', . . .}
]);
I receive a runtime error which indicates I'm missing an activate() method.
aurelia-history.js:4 Uncaught (in promise) Error: History must implement activate().
at mi (aurelia-history.js:4)
at History.activate (aurelia-history.js:13)
at AppRouter.activate (aurelia-router.js:1743)
at aurelia-router.js:1722
I get that there is an activate() missing and it's dropping through to the prototype and throwing this error, I just can't figure out where to add the activate(). I have it in my module, but should I somehow have one in my App class or this history object?
Thanks
-John
Ok, for the benefit of other strugglers I tried to retrace my steps and piece together how I solved my problem - the challenge was I changed many variables.
But I believe I was able to re-create my error and I broke my application in the same way as before.
The error may have started appearing when I upgraded my aurelia-router version from 1.2.1 to 1.6.2.
This was my old package.json:
{
"name": "ClientWeb",
"private": true,
"version": "0.0.0",
"devDependencies": {
"#types/webpack-env": "^1.13.0",
"aspnet-webpack": "^2.0.1",
"aurelia-bootstrapper": "^2.0.1",
"aurelia-fetch-client": "^1.0.1",
"aurelia-framework": "^1.1.0",
"aurelia-loader-webpack": "^2.0.0",
"aurelia-pal": "^1.3.0",
"aurelia-router": "^1.2.1",
"aurelia-webpack-plugin": "^2.0.0-rc.2",
"bootstrap": "^3.3.7",
"css-loader": "^0.28.0",
"extract-text-webpack-plugin": "^2.1.0",
"file-loader": "^0.11.1",
"html-loader": "^0.4.5",
"isomorphic-fetch": "^2.2.1",
"jquery": "^3.2.1",
"json-loader": "^0.5.4",
"style-loader": "^0.16.1",
"ts-loader": "^2.0.3",
"typescript": "^2.2.2",
"url-loader": "^0.5.8",
"webpack": "^2.3.3",
"webpack-hot-middleware": "^2.18.0"
},
"dependencies": {
"#types/vis": "^4.21.7",
"vis": "^4.21.0"
}
}
At the time I was upgrading several libraries to the latest versions, but I tried reverting back to this original package.json and just updated the aurelia-router version - it generates the original error.
Hope this helps someone.
-John
The reason you have this issue is because you didn't include aurelia-history-browser in your plugins via: aurelia.use.history() or aurelia.use.standardConfiguration().
The aurelia-history-browser module implements the aurelia-history abstract class History, which is a wrapper around native History of browser. The abstract class History basically throw an error with the method name when you call it, like the error you saw.

React Native Metro Bundler issue with invalid left side AssingmentExpression

I'm just simply trying to start metro bundler to serve the app. Here's the error:
TypeError: Property left of AssignmentExpression expected node to be of a type ["LVal"] but instead got "StringLiteral"
at Object.validate (/Users/tyler/Code/.../node_modules/#babel/types/lib/definitions/utils.js:128:13)
at Object.validate (/Users/tyler/Code/.../node_modules/#babel/types/lib/validators/validate.js:17:9)
at NodePath._replaceWith (/Users/tyler/Code/.../node_modules/#babel/traverse/lib/path/replacement.js:194:9)
at NodePath.replaceWith (/Users/tyler/Code/.../node_modules/#babel/traverse/lib/path/replacement.js:178:8)
at PluginPass.MemberExpression (/Users/tyler/Code/.../node_modules/babel-plugin-transform-inline-environment-variables/lib/index.js:19:18)
at newFn (/Users/tyler/Code/.../node_modules/#babel/traverse/lib/visitors.js:193:21)
at NodePath._call (/Users/tyler/Code/.../node_modules/#babel/traverse/lib/path/context.js:53:20)
at NodePath.call (/Users/tyler/Code/.../node_modules/#babel/traverse/lib/path/context.js:40:17)
at NodePath.visit (/Users/tyler/Code/.../node_modules/#babel/traverse/lib/path/context.js:88:12)
at TraversalContext.visitQueue (/Users/tyler/Code/.../node_modules/#babel/traverse/lib/context.js:118:16)
which means something like Platform.OS = "ios" is transformed into "ios" = "ios": like so <- That PR also addresses the TypeError being thrown for the process.env which seems to be the case for me. My stack trace references ...babel-plugin-transform-inline-environment-variables/lib/index.js:19:18 which deals exclusively with setting process.env. There are only two places in my code using a var from process.env and neither are used on the left side of an assignment.
PR 45 for the metro bundler was merged way back in 2017 though. And I'm using the latest version btw, this is occurring when trying to start up the bundler with the script "NODE_ENV=development npm start -- --reset-cache". Note that I am using the reset cache flag as mentiond here
A coworker suggested the error may be cause by a react-native plugin, but I haven't uncovered it yet if that is the case. We did just migrate this app to Babel 7, fyi. I'm hitting a wall now on ideas and the google trail is growing stale. What else could be the cause of this error?
Here are the dependencies from my package.json in case it helps:
}
...
"dependencies": {
"#babel/runtime": "^7.0.0",
"lodash.capitalize": "^4.2.1",
"lodash.debounce": "^4.0.8",
"lodash.find": "^4.6.0",
"phoenix": "^1.3.4",
"prettier": "^1.14.2",
"prop-types": "^15.6.2",
"react": "^16.4.2",
"react-native": "0.57.0",
"react-native-firebase": "^4.3.8",
"react-native-keep-awake": "^3.1.0",
"react-native-linear-gradient": "^2.4.2",
"react-native-router-flux": "^4.0.1",
"react-native-swiper": "^1.5.13",
"react-native-tts": "^2.0.0",
"react-redux": "^5.0.7",
"redux": "^4.0.0",
"redux-thunk": "^2.3.0",
"spokestack-react-native": "0.0.2"
},
"devDependencies": {
"#babel/plugin-proposal-object-rest-spread": "^7.0.0",
"#babel/plugin-transform-runtime": "^7.0.0",
"babel-core": "^7.0.0-bridge.0",
"babel-plugin-transform-inline-environment-variables": "^0.4.3",
"imagemin": "^6.0.0",
"imagemin-jpegtran": "^5.0.2",
"imagemin-optipng": "^5.2.1",
"imagemin-svgo": "^7.0.0",
"jest": "^23.6.0",
"metro-react-native-babel-preset": "^0.45.2",
"pre-commit": "^1.2.2",
"precise-commits": "^1.0.2",
"react-test-renderer": "^16.4.2",
"redux-mock-store": "^1.5.3"
},
...
}
...and additionally, the babel.config.js as per babel 7
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
plugins: [
'#babel/plugin-transform-runtime',
'#babel/plugin-proposal-object-rest-spread',
'transform-inline-environment-variables'
]
}
UPDATE: I used grep within the react-* packages to find additional lines where process.env were used as a lefthand assignment. Only found a few, but couldn't resolve the issue.
The error you see in the log is related to babel-plugin-transform-inline-environment-variables. If you exclude it from your configuration file, the build should pass.
I'm facing the same issue and haven't found a good solution so far, so try to workaround a way how you pass your environment variables.

Nuxt Hanging during generate script

When I try to run the generate script with nuxt my node process ends up hanging.
Nuxt goes through the generate step, but hangs with my console saying "Generate errors summary" and then nothing.
nuxt:render Rendering url / +5s
nuxt: Call generate:done hooks (1) +13ms
nuxt:generate HTML Files generated in 46.1s +14ms
Generate errors summary:
Has anyone run into this before?
Package.json:
"dependencies": {
"contentful": "^6.1.1",
"contentful-management": "^5.1.4",
"nuxt": "^1.4.0",
"vue-markdown": "^2.2.4"
},
"devDependencies": {
"babel-eslint": "^7.1.1",
"eslint": "^3.15.0",
"eslint-config-standard": "^6.2.1",
"eslint-loader": "^1.6.1",
"eslint-plugin-html": "^2.0.0",
"eslint-plugin-promise": "^3.4.1",
"eslint-plugin-standard": "^2.0.1"
}
Didn't have a CSS loader, added one and everything works.
From the documentation
Nuxt.js will automatically guess the file type by it's extension and use the
appropriate pre-processor loader for webpack. You will still need to install
the required loader if you need to use them.