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
Related
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 working on a big project and I cannot run it anymore because of this error:
When I run npm run serve
ERROR TypeError: Cannot read property 'NormalModule' of undefined
TypeError: Cannot read property 'NormalModule' of undefined
at VueLoaderPlugin.apply (/Users/<user>/muso-ninjas/node_modules/vue-loader-v16/dist/pluginWebpack5.js:44:47)
at webpack (/Users/<user>/muso-ninjas/node_modules/#vue/cli-service/node_modules/webpack/lib/webpack.js:51:13)
at serve (/Users/<user>/muso-ninjas/node_modules/#vue/cli-service/lib/commands/serve.js:163:22)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
Please help me because I am stuck and I would like to go with my project.
Try this first:
In your project root, run npm install. Maybe someone else on your project has changed/added a dependency, and pulling from your git repo got you the code that relies on this, but won't get you the dependency itself.
If that doesn't fix your issue, try this:
Remove the node_modules folder in your project root.
Update your Node.js version to the latest 16.x version.
2.1 Verify the update has worked by issuing node -v in the terminal.
Update your npm: Run npm i -g npm in the terminal.
3.1 Very the update has worked by issuing npm -v in the terminal.
Run npm install in your project's root folder.
If this doesn't fix your issue, you need to find help from someone else on your team.
As suggested in link from the first comment, I deleted node_modules, replaced the node-sass in package.json with "sass": "^1.26.5" and ran npm install but it didn't work.
Then I repeated the steps and removed package-lock.json as well.
This helped and the app was served properly
npm install webpack#4.39.3 --save
The Goal: 'npx elm make' running successfully in a GitLab CD
Background: I have a bit of a toy frontend project on GitLab pages, and I've written a crude CI/CD pipeline for it. This includes building a subdirectory with elm files. It worked for a while and then suddenly broke, and I can't seem to fix it.
The script is as follows:
cd public/scripts/
npm i
cd elm/
npx elm make src/Main.elm --output=index.js
and then continues with the rest of the script.
These instructions work fine on my machine.
The issue: 'npx elm make' looks for a package.json in the elm directory.
Here is the output from the failed build:
Running with gitlab-runner 13.5.0-rc2 (71c90c86)
on docker-auto-scale z3WU8uu-
Resolving secrets
00:00
Preparing the "docker+machine" executor
Using Docker executor with image node:latest ...
Pulling docker image node:latest ...
Using docker image sha256:ca36fba5ad66b0f8fce2b97a6f0aa53267395388ada988534d848638312ccb68 for node:latest with digest node#sha256:bf60a164bc588967ce6e3342c9d6508bf9ad2e7e2a1c237315596eab3e13428b ...
Preparing environment
00:03
Running on runner-z3wu8uu--project-21153296-concurrent-0 via runner-z3wu8uu--srm-1603581774-6b7f1e48...
Getting source from Git repository
00:23
$ eval "$CI_PRE_CLONE_SCRIPT"
Fetching changes with git depth set to 50...
Initialized empty Git repository in /builds/chicagotestout/chicagotestout.gitlab.io/.git/
Created fresh repository.
Checking out b73b89bb as master...
Skipping Git submodules setup
Executing "step_script" stage of the job script
00:01
$ cd public/scripts/
$ npm i
up to date, audited 49 packages in 644ms
found 0 vulnerabilities
$ cd elm/
$ npx elm make src/Main.elm --output=index.js
npm ERR! code ENOENT
npm ERR! syscall open
npm ERR! path /builds/chicagotestout/chicagotestout.gitlab.io/public/scripts/elm/package.json
npm ERR! errno -2
npm ERR! enoent ENOENT: no such file or directory, open '/builds/chicagotestout/chicagotestout.gitlab.io/public/scripts/elm/package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent
npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2020-10-24T23_24_44_668Z-debug.log
Cleaning up file based variables
00:01
ERROR: Job failed: exit code 1
So it's looking for a package.json file in the elm subdirectory. Okay. But I don't have (and don't need, and don't want) a package.json file there. The relevant package.json file is in its parent directory (scripts) where elm is installed.
Confounding factors
You might be wondering what was in the commit that broke the build when it quit working, but there's nothing in that commit that should have broken the build in this way. The commit didn't touch any configuration files, just some .elm source files.
My gut says this is an npm thing, but I can't quite rule out the idea that this is an elm thing or a gitlab-ci thing.
I've searched for this issue, but it seems like this is a pretty uncommon issue, and I'm struggling to filter out a heap of other package.json search terms.
In Conclusion
How do I get npx to look in the parent directory for the appropriate package.json?
Help appreciated.
I am building frontend of a web app using vuejs. till yesterday my app was running fine but all of sudden today yarn serve command is throwing an error.
Error: watch /home/abhey/Documents/abhey/astrix/astrix_final_project/ecommerceFrontend/public ENOSPC
at _errnoException (util.js:1022:11)
at FSWatcher.start (fs.js:1382:19)
at Object.fs.watch (fs.js:1408:11)
at createFsWatchInstance (/home/abhey/Documents/abhey/astrix/astrix_final_project/ecommerceFrontend/node_modules/chokidar/lib/nodefs-handler.js:37:15)
at setFsWatchListener (/home/abhey/Documents/abhey/astrix/astrix_final_project/ecommerceFrontend/node_modules/chokidar/lib/nodefs-handler.js:80:15)
at FSWatcher.NodeFsHandler._watchWithNodeFs (/home/abhey/Documents/abhey/astrix/astrix_final_project/ecommerceFrontend/node_modules/chokidar/lib/nodefs-handler.js:232:14)
at FSWatcher.NodeFsHandler._handleDir (/home/abhey/Documents/abhey/astrix/astrix_final_project/ecommerceFrontend/node_modules/chokidar/lib/nodefs-handler.js:414:19)
at FSWatcher.<anonymous> (/home/abhey/Documents/abhey/astrix/astrix_final_project/ecommerceFrontend/node_modules/chokidar/lib/nodefs-handler.js:462:19)
at FSWatcher.<anonymous> (/home/abhey/Documents/abhey/astrix/astrix_final_project/ecommerceFrontend/node_modules/chokidar/lib/nodefs-handler.js:467:16)
at FSReqWrap.oncomplete (fs.js:153:5)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
I did try to look into the documentation but it was of no use. I also tried to start a new project altogether but it was of no help. any suggestions? if it's of any use I am using Linux Mint 19 as my os.
Well I had the same problem with npm.
You can try to clean the npm cache remove the node module folder and re install the dependencies try this code in your terminal.
cd ~
sudo rm -rf .npm
cd <package folder where node module exist>
npm cache clean
rm -rf node_modules
npm install
try same logic with yarn it will solve your problem.
Why? Why is react looking here? I have another test android project and it also does not have react package located there, yet it runs perfectly. Why is this one looking here? The only difference is I first did setup a directory below. In MyProject/App is where i did the init. I then moved the index.js files and package.json a level up to top level directory. I want to know the WHY of this error!
Here is the error:
error: bundling: UnableToResolveError: Unable to resolve module
react/lib/ReactComponentTreeHook from /Users/Admin/Projects/MyProject/node_modules/react- native/Libraries/Performance/Systrace.js:
Module does not exist in the module map or in these directories:
/Users/Admin/Projects/MyProject/node_modules/react- native/node_modules/react/lib
, /Users/Admin/Projects/MyProject/node_modules/react/lib
This might be related to https://github.com/facebook/react-native/issues/4968
To resolve try the following:
1. Clear watchman watches: `watchman watch-del-all`.
2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.
3. Reset packager cache: rm -fr $TMPDIR/react-* or `npm start --reset-cach
All these steps I have tried. They don't fix it. I will probably do another init a level above but still I want to know whey it's looking there. Is there a module map being setup somewhere incorrectly? Where do I look for this?
UPDATE: After doing init properly in the root directory of the app I now get something else:
Loading dependency graph, done.
error: bundling: UnableToResolveError: Unable to resolve module react/lib/ReactDebugCurrentFrame from /Users/Admin/Projects/MyProjectRoot/node_modules/react-native/Libraries/Renderer/src/renderers/shared/stack/reconciler/ReactCompositeComponent.js: Module does not exist in the module map or in these directories:
This leads to suggestions that you need alpha version of react to go along with latest react:
https://github.com/facebook/react-native/issues/13017
But doing this does not work. It just leads back to the same issue I had to begin with about ReactComponentTreeHook.
Again, same suggestions about how to fix it. rm -rf node_modules followed by npm install! But I also did a npm install --save on react react-native. I think I need some response from react-native team on how to properly interpret this kind of error. What's going on here?
Xcode 8.2 still occur same error. Three lines bellow fixed it for me :)
Downgrade react(16.0.0-alpha.12 -> 16.0.0-alpha.6) & react-native(0.45.0 -> 0.44.0)
rm -rf node_modules/react
npm i react#16.0.0-alpha.6 -S
npm i react-native#0.44.0 -S
Then run react-native run-ios
Hope this help.
The problem is that the npm init, npm install --save react -react-native does not install the correct versions. What you need to do is look at the version of react inside package.json In my case it was an alpha.
So right now need to do:
npm install --save react#16.0.0-alpha.6 react-native
but check what's inside your package.json and watch any warning messages carefully
Try install react-native-git-upgrade
$ npm install -g react-native-git-upgrade
and then run
$ react-native-git-upgrade
for me it works.
This error happens when someone upgrade react-native version.
$ npm install -g react-native-git-upgrade
$ npm install react-native#latest --save
$ react-native-git-upgrade
Close all terminals.
Then clear cache. Remove directory ~/Library/Developer/Xcode/DerivedData
In Xcode, Product-> Clean
Then run simulator from Xcode or run code on the attached device again.