I am stuck at this for a long time now. Have tried everything. Can someone please help me understand why is this happening? I have attached the screenshot of the error as below
[PS C:\Users\Hp\Desktop\projects> expo init Mealtogo
Migrate to using:
› npx create-expo-app --template
√ Choose a template: » blank a minimal app as clean as an empty canvas
Error downloading and extracting template package: Error: Could not parse JSON returned from "npm pack expo-template-blank --dry-run".
expo-template-blank-46.0.21.tgz
Error: Unexpected token e in JSON at position 0
× Something went wrong while downloading and extracting the template.
Can't read JSON file: C:\Users\Hp\Desktop\projects\Mealtogo\app.json
└─ Cause: Error: ENOENT: no such file or directory, open 'C:\Users\Hp\Desktop\projects\Mealtogo\app.json'
├─ readAsync C:\Users\Hp\AppData\Roaming\npm\node_modules\expo-cli\node_modules#expo\json-file\src\JsonFile.ts:158:13
├─ extractAndPrepareTemplateAppAsync C:\Users\Hp\AppData\Roaming\npm\node_modules\expo-cli\src\commands\utils\extractTemplateAppAsync.ts:25:25
└─ actionAsync C:\Users\Hp\AppData\Roaming\npm\node_modules\expo-cli\src\commands\initAsync.ts:290:19]1
try with:
npx create-expo-app --template
Related
I just started learning Parcel, so apologies if this question makes no sense.
Basically, when I'm inside a projectName/dist parcel index.html works just fine however when I'm in projectName dir and try parcel .\dist\index.html I get this monstrosity:
‼ Could not load existing sourcemap of "base.cf80568e.css".
Browserslist: caniuse-lite is outdated. Please run:
× C:\[...]\projectName\dist\style.251b6741.3dae4bc5.js: ENOENT: no such file or directory, open 'C:\[...]\projectName\dist\style.251b6741.3dae4bc5.js'
Error: ENOENT: no such file or directory, open 'C:\[...]\projectName\dist\style.251b6741.3dae4bc5.js'
‼ Could not load existing sourcemap of "style.251b6741.css".
‼ Could not load existing sourcemap of "base.cf80568e.css".
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist#latest --update-db
Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist#latest --update-db
Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
Inside html, my css and js references change from e.g. style.css to /style.251b6741.eb5df69a.css (which gets created in dist folder and is the exact copy of style.css).
Also after parsing npx browserslist#latest --update-db in terminal, I get a message that everything is up to date???
I have no clue why it does that, I've searched the internet for somebody to have the same problem for about 2h now, to no avail :c
Tried every possible step
Reinstalled Node, NPM, Expo, etc.
Cleaned Cache, verified it aswell.
Please help or I would have to reinstall Ubuntu.
faisal#PC:~$ expo init
Migrate to using:
› npx create-expo-app --template
✔ What would you like to name your app? … my-app
✔ Choose a template: › blank a minimal app as clean as an empty canvas
Error downloading and extracting template package: TypeError: Cannot read properties of null (reading '0')
✖ Something went wrong while downloading and extracting the template.
Can't read JSON file: /home/faisal/my-app/app.json
└─ Cause: Error: ENOENT: no such file or directory, open '/home/faisal/my-app/app.json'
├─ readAsync /usr/local/lib/node_modules/expo-cli/node_modules/#expo/json-file/src/JsonFile.ts:158:13
├─ extractAndPrepareTemplateAppAsync /usr/local/lib/node_modules/expo-cli/src/commands/utils/extractTemplateAppAsync.ts:25:25
└─ actionAsync /usr/local/lib/node_modules/expo-cli/src/commands/initAsync.ts:290:19
faisal#PC:~$ npx create-expo-app myapp
✖ Something went wrong in downloading and extracting the project files: Could not find npm package "expo-template-blank#latest"
Error cloning template: Error: Could not find npm package "expo-template-blank#latest"
faisal#PC:~$ npm ls -g
/usr/local/lib
+-- #angular/cli#14.2.3
+-- expo-cli#6.0.5
+-- expo-template-blank#46.0.21
`-- npm#8.19.2
faisal#PC:~$ npm -v
8.19.2
Reinstalled Node using NVM
Apparently the node I installed multiple times through the store was giving the error so I decided to use the Node Version Manager instead.
Instructions:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.38.0/install.sh
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.38.0/install.sh | bash
source ~/.bashrc
nvm list-remote
nvm install v16.17.1
And yes, it works:
faisal#pc:~$ nvm install v16.17.1
Downloading and installing node v16.17.1...
Downloading https://nodejs.org/dist/v16.17.1/node-v16.17.1-linux-x64.tar.xz...
######################################################################################################################################################################### 100.0%
Computing checksum with sha256sum
Checksums matched!
Now using node v16.17.1 (npm v8.15.0)
Creating default alias: default -> v16.17.1
faisal#pc:~$ expo init
Migrate to using:
› npx create-expo-app --template
✔ What would you like to name your app? … my-app
✔ Choose a template: › blank a minimal app as clean as an empty canvas
✔ Downloaded template.
📦 Using npm to install packages.
✔ Installed JavaScript dependencies.
✅ Your project is ready!
To run your project, navigate to the directory and run one of the following npm commands.
- cd my-app
- npm start # you can open iOS, Android, or web from here, or run them directly with the commands below.
- npm run android
- npm run ios # requires an iOS device or macOS for access to an iOS simulator
- npm run web
If you previously installed a global react-native-cli package, please remove it as it may cause unexpected issues:
Run this command
npm uninstall -g react-native-cli #react-native-community/cli
Start a new project
npx react-native init AwesomeProject
I am trying to get the basic react native app from https://reactnative.dev/docs/environment-setup running via the CLI, but I am getting errors. I have node, python2 and jdk8 installed. I have all the Android Studio components installed as far as I can tell. I've added the environment variables.
When I run npx react-native init AwesomeProject to initialise the project, I get green ticks next to Downloading Template, Copying Template and Processing Template, but a red cross next to Installing dependencies. The error below that states Error: command failed: npm install. And further down after some warnings it states npm ERR! Unexpected end of JSON input while parsing near '...anbul":"0.4.5","mocha'
And in the initialised app folder there are no node modules.
Any idea how I get this working?
Hi the solution for this is to clear your cache :)
Please run the following command and retry:
npm cache clean --force
I have no error in my project. But the build not successfully load. see the below image. for more details for error. I am using the below command to run the build react-native run-android but the npm failed to create the build. this image directory exists and I give the correct path for images. Thanks in advance.
-root
--assets
---images
---- All Images here.
../../assets/images/sky-img.jpg use this in code.
Just closing and re-opening the cmd terminal or whatever you are using to run the metro bundler worked for me.
Just reset the cache of your Metro Bundler with:
npm start -- --reset-cache
This is happening because the bundler needs to refresh it's existing bundles and the path you previously set.
Make sure you run the command from the root directory and not from android directory.
android> cd..
project> npx react-native run-android --variant=release
When trying to run my React Native app I get this error:
error: bundling failed: Error: Expected path `/Users/jgallaso/Projects/aerogear/aerogear-react-native-core/index.js` to be relative to one of the project roots
at toLocalPath (/Users/jgallaso/Projects/aerogear/aerogear-js-sdk/example/react-native/node_modules/metro/src/node-haste/lib/toLocalPath.js:33:9)
at ModuleCache.getModule (/Users/jgallaso/Projects/aerogear/aerogear-js-sdk/example/react-native/node_modules/metro/src/node-haste/ModuleCache.js:94:20)
at ModuleResolver._getFileResolvedModule (/Users/jgallaso/Projects/aerogear/aerogear-js-sdk/example/react-native/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:320:42)
at ModuleResolver.resolveDependency (/Users/jgallaso/Projects/aerogear/aerogear-js-sdk/example/react-native/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:311:989)
at ResolutionRequest.resolveDependency (/Users/jgallaso/Projects/aerogear/aerogear-js-sdk/example/react-native/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:96:16)
at DependencyGraph.resolveDependency (/Users/jgallaso/Projects/aerogear/aerogear-js-sdk/example/react-native/node_modules/metro/src/node-haste/DependencyGraph.js:269:4352)
at /Users/jgallaso/Projects/aerogear/aerogear-js-sdk/example/react-native/node_modules/metro/src/DeltaBundler/traverseDependencies.js:201:36
at next (native)
at step (/Users/jgallaso/Projects/aerogear/aerogear-js-sdk/example/react-native/node_modules/metro/src/DeltaBundler/traverseDependencies.js:256:306)
at /Users/jgallaso/Projects/aerogear/aerogear-js-sdk/example/react-native/node_modules/metro/src/DeltaBundler/traverseDependencies.js:256:536
BUNDLE [android, dev] ./index.js ▓▓▓▓▓▓▓▓▓░░░░░░░ 56.6% (331/440), failed.
My app has a dependency installed aerogear-react-native-core that is a Native Module. Source code is at: https://github.com/josemigallas/aerogear-react-native-core
This package on the other hand depends on other TS one (I ignore if this is problematic) and this code is located at: https://github.com/josemigallas/aerogear-js-sdk/tree/poc_react_native_library/packages/core
And the app code that actually tries to use all this is located at: https://github.com/josemigallas/aerogear-js-sdk/tree/poc_react_native_library/example/react-native
This means:
App
└─┬ aerogear-react-native-core#0.0.2
└── #aerogearmobile/core#1.0.0
Since this is all at development stage, nothing is pushed to npmjs, I'm just using npm link to include all dependencies.
Honestly I don't have a clue why this is failing, without the second dependency everything worked all right so that makes me think typescript has something to do. However, the error is complaining about aerogear-react-native-sdk's index.js file so maybe the error is related with the link.
I tried deleting all caches, re-installing npm modules, re-running the bundler many times...
If you have used "npm link" in the project, that might be the reason. Metro Bundler does not work with symlink correctly. Try to install the dependency without using "npm link".