When I create a new React app via the npx create-react-app my-app command, linting errors do not get flagged within the editor. They still appear in the terminal when the app is run of course.
create-react-app: v.5.0.0
react: v.17.0.2
npm: v.8.1.2
editor: Atom v.1.60.0
Atom Linting Packages:
jsonlint v.1.1.4
linter v3.4.0
linter-eslint 9.0.0
linter-ui-default 3.4.1
Any ideas of why this might be?
Note: I've got other projects linting properly with Atom, just not sure why base CRA does not lint.
Related
What's the problem:
I recently started learning reactjs. while creating a new react app, the build fails and only a package.json file is created.
> PS D:\react-projects> npx create-react-app app-name Creating a new
> React app in D:\react-projects\exercount.
>
> Installing packages. This might take a couple of minutes. Installing
> react, react-dom, and react-scripts with cra-template...
>
>
> added 1396 packages, and changed 1 package in 9m 203 packages are
> looking for funding run `npm fund` for details
> Missing dependencies in package.json
What I used:
VS CODE 1.69
Windows 10 Home single language Version 10.0.19044 Build 19044
Node v16.16
NPM v8.13.2
when did i encounter it:
I tried to create my first react app by following the reactjs official tutorial. I opened vs code in administrator mode and ran the following command in the terminal
npx create-react-app myapp
while this worked fine in my friends linux laptop, it failed in my windows one.
All it does is throw a "Missing dependancies in package.json" message and only builds a folder with one package.json file.
What have i tried:
various commands to create the app like - npx, npm create-react-app and create-react-app itself
have run those commands with and without the "-use--npm" flag
forced flushed the npm cache
uninstalled and reinstalled vs code, npm and node
All i found online were a few similar questions with only small number of them with answers. I have tried all of them and nothing worked.If you know what could be causing this, it would be helpful.
Screenshots:
terminal
package.json file
I had the same. The problem was resolved by downgrading npm to version 8.3.0 npm install -g npm#8.3.0
I am doing the react-native typescript setup which I ran
npx react-native init MyApp --template react-native-template-typescript
I installed typescript
npm install -g typescript
'npx --v' -> 6.14.15
'npm view react-native version' -> 0.67.2
'npm view typescript version' -> 4.5.5
'node -v' -> v12.22.9
and then immediately, I get errors from the template ->
node_modules/#types/node/globals.d.ts:47:11 - error TS2300: Duplicate identifier 'AbortController'.
47 interface AbortController {
~~~~~~~~~~~~~~~
node_modules/#types/react-native/globals.d.ts:435:15
435 declare class AbortController {
~~~~~~~~~~~~~~~
'AbortController' was also declared here.
Once I solve this my next question is having all developers use the same tool versions to avoid this dependency hell. The only one dealing with dep hell will be the person doing the upgrade. everyone else will magically get their tool and lib versions changed hopefully!!!
Well, today I ran
npx react-native init MyApp --template react-native-template-typescript
in another directory and running 'tsc' works
tsc still does not work in the other MyApp directory and a comparison shows a whole slew of things that are not different versions. I have no idea why but my guess is this is a 'always using latest versions' issue. At least the template locks into a version(I think) so versions will not change on my working project(I hope).
I know npx create-react-app and npx-next-app what are all others app npx support?
npx is a program that downloads any package on npm. create-react-app isn't a command for npx, rather, you're telling npx:
Download react-create-app
Cache it (but not in the current directory, so it will stay 'clean')
Try to run it as a program (the package.json file says how to do that, in this case: "run node ./index.js")
npx knows nothing of React or Next.js and it doesn't have these things built in. All it knows is about is npm and how to run any (executable) package it downloads from there, like npx gulp or npx serve.
If you're working with a new framework and you're wondering if there's a utility to quickly set up a project, just search NPM and see what pops up.
There is no set list because npx is a package runner for Node.js. Running npx create-react-app will try to find the package create-react-app and run it. The package will be downloaded if not locally installed.
Therefore, the list of supported commands for npx is "everything included in the repositories used by NPM". You can even create your own package, not visible to anybody else, and run it with npx.
I'm starting work on React Native, using create-reactive-native-app and Exponent. There is a nice list of open source examples here, some of then are mentioned to use Exponent.
https://github.com/ReactNativeNews/React-Native-Apps
I have few experience with nodejs. I already noticed there are several possible configurations for React Native apps. I usually use npm start to run it, but that don't work on those examples, since since they don't have a start script in package.json.
Take as an example the native-component-list app. How can I execute it after cloning and doing npm install?
Using node v6.11.4 and npm 3.10.10
I also tried using react-native run-android . It works when I create a new project with react-native init Ola2
But not with the downloaded code.
Here are some more details. I did this before: npm install -g react-native-cli
npm install
react-native run-android
Scanning folders for symlinks in xxx/native-component-list/node_modules (25ms)
Android project not found. Maybe run react-native android first?
react-native android
Scanning folders for symlinks in xxx/native-component-list/node_modules (26ms)
Unrecognized command 'android'
Run react-native --help to see list of all available commands
As per this link, you can run the app with command react-native run-android (for android)
I found the problem. I just had never used Expo.io way to create a ReactNative app. I only knew the init and the crna ways. This apps where created with the exp tool.
So,to run it, just do:
npm install exp --global
npm install
exp android
exp start
I didn't work on Expo, I prefer react-native-cli
In your case, your project in developed on Expo.
So you need expo-cli to run the project.
For Expo Cli
npm install -g expo-cli
For CRNA
npm i -g create-react-native-app
Internally CRNA use EXPO, so you can choose any option. After installing the expo-cli npm start command work fine for you.
Or you can eject this project.
You can run npm run eject to get a project very similar to what react-native init would generate. At that point you’ll need Xcode and/or Android Studio just as you would if you started with react-native init , adding libraries with react-native link will work, and you’ll have full control over the native code compilation process.
Hope it will work for you.
When I try to install eslint (npm i eslint) I get the error
"`-- eslint#2.7.0 extraneous"
I'm new to npm and vs code. I installed several extensions with no problem, this installed with errors via the ctl-p input box.
"`-- eslint#2.7.0 extraneous" means that this package installed but isn't listed in your package.json.