Caching issues in Gatsby v2 project - javascript

I am getting errors running 'gatsby develop' on a Gatsby v2 site after deleting a few old pages.
error UNHANDLED EXCEPTION Error: ENOENT: no such file or directory,
open 'D:\dev\my-gatsby-blog\public\static\d\573\path---
my-blog-post-d-5-f-ef1-Y9bdv2wHaTrcrlb7d2XeeQc6MYw.json'
websocket-manager.js:21 readCachedResults [my-blog]/[gatsby]/dist/utils/websocket-manager.js:21:24
websocket-manager.js:44 getCachedPageData [tutorial-part-four]/[gatsby]/dist/utils/websocket-manager.js:44:13
websocket-manager.js:140 Socket.s.on.path [tutorial-part-four]/[gatsby]/dist/utils/websocket-manager.js:140:26
socket.js:528 [tutorial-part-four]/[socket.io]/lib/socket.js:528:12
next_tick.js:131 _combinedTickCallback internal/process/next_tick.js:131:7
next_tick.js:180 process._tickCallback internal/process/next_tick.js:180:9
My particular site is a blog that shows a list of posts on the index. Not sure if its relevant but the deleted pages are Markdown files resolved with the plugin gatsby-transformer-remark.

I was able to resolve this by deleting the contents of the .cache directory. Using rimraf I added a new script to my package.json to simplify the process in the future.
"cleancache": "rimraf .cache/*"

If you have Gatsby CLI installed, you can now also run
gatsby clean
This will get rid of your .cache folder as well as public/ directories.
https://www.gatsbyjs.org/docs/gatsby-cli/#clean

Related

ENOENT: no such file or directory in Gatsby

I've started learning Gatsby, every time I make any changes in src/pages folder, it gives an error that comes from .cache folder like this:
Generating development JavaScript bundle failed
ENOENT: no such file or directory, open '...\Gatsby\src\pages\someFile.js'
I am deleting .cache folder then re-running gatsby develop command and it works, but it takes more time.
Question: Is there any command to make it faster or easier?
Question: Is there any command to make it faster or easier?
gatsby clean does the trick. It removes the .cache and the /public folders. From Gatsby's docs:
At the root of a Gatsby site, wipe out the cache (.cache folder) and
public directories:
gatsby clean
This is useful as a last resort when your local project seems to have
issues or content does not seem to be refreshing. Issues this may fix
commonly include:
Stale data, e.g. this file/resource/etc. isn’t appearing GraphQL
error, e.g. this
GraphQL resource should be present but is not
Dependency issues, e.g. invalid version, cryptic errors in console,
etc.
Plugin issues, e.g. developing a local plugin and changes don’t
seem to be taking effect
I personally add my own commands in the package.json, like:
"scripts": {
// other scripts
"start": "gatsby clean && gatsby develop",
},
So every time I need to run a gatsby develop I run yarn start or npm run start instead, executing the gatsby clean command before.

Updating deployment

I recently deployed a nodejs API through Heroku. I want to update the new changes to the deployment but whenever I push (git push Heroku master) I receive an error.
Error: ENOENT: no such file or directory, scandir '/app/seeds'
This started behaving this way after I ran npm install pg
While deploying the changes to Heroku it is unable to find /app/seeds directory and so it will not be able to be pushed to Heroku and this is what causes a problem.
Maybe some of your files do have got deleted. So here what you can do is delete your node_modules folder and just run the command npm install so all your packages should be having completed files and then do git push heroku master.
I also faced a similar issue and it resolved my problem. So can you please give it a try.

Error when building next.js app: Can't resolve 'next/head'

I am getting the below error when doing next build in my next.js app, after it's been working fine with just next (or npm run dev).
The error:
$ next build
The module 'react-dom' was not found. Next.js requires that you include it in 'dependencies' of your 'package.json'. To add it, run 'npm install --save react-dom'
Creating an optimized production build ...
> Using external babel configuration
> Location: "../.babelrc"
Failed to compile.
./pages/_app.js
Module not found: Can't resolve 'next/head' in '../pages'
> Build error occurred
Error: > Build failed because of webpack errors
at build (.../AppData/Roaming/npm/node_modules/next/dist/build/index.js:7:847)
I started my project by cloning Material UI's next.js example and just use that as it seems updated:
https://github.com/mui-org/material-ui/tree/master/examples/nextjs
However, thinking I just may of have an outdated or broken build, I re-cloned the next.js example and did next build as well, without modifying any files and I get the same error.
How can I fix this?
I just cloned that next.js example and it worked both with npm run dev, as well as npm run build->npm run start.
Judging by your error, I would check that "react-dom": "latest" is present in your package.json's dependencies. Did you run npm install after cloning the example?
The solution to this problem is to Just rerun these two commands again then your project will successfully Run. I also faced this problem but I got the solution.
npm i
yarn install
I ran into a similar problem when I included my nextjs app in a yarn workspace. I got around the issue by deleting the following directories in my nextjs app:
node_modules
.next
build
After removing them I ran yarn from the repo directory and started the nextjs app back up and it was working again.

react-native, bundling failed

I am new to react-native and have found an error that makes absolutely no sense to me.
I am trying to include a calendar library: https://github.com/wix/react-native-calendars
I have included the dependency for that library in my package.json file and run npm install
The project was running fine and as expected. I have simply added one line of code to the project:
import { Calendar, CalendarList, Agenda } from 'react-native-calendars';
Nothing else. However now I am getting a red error message when the app loads on device and this is what my console is saying:
error: bundling failed: Error: While trying to resolve module xdate
from file
/Users/Alex/Documents/workspace/mobile/node_modules/react-native-calendars/src/index.js,
the package
/Users/Alex/Documents/workspace/mobile/node_modules/xdate/package.json
was successfully found. However, this package itself specifies a
main module field that could not be resolved
(/Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js.
Indeed, none of these files exist:
*
/Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json)
*
/Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js/index(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json)
at ResolutionRequest.resolveDependency (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:103:15)
at DependencyGraph.resolveDependency (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/node-haste/DependencyGraph.js:272:4579)
at dependencies.map.relativePath (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:376:19)
at Array.map ()
at resolveDependencies (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:374:16)
at /Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:212:33
at Generator.next ()
at step (/Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:297:313)
at /Users/Alex/Documents/workspace/mobile/node_modules/metro/src/DeltaBundler/traverseDependencies.js:297:473
at
However I have checked in the directory and in fact /Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js does exist. However I do not see any of this part: (.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json)`
As to how /Users/Alex/Documents/workspace/mobile/node_modules/xdate/src/xdate.js/index can exist, that doesn't make sense because xdate.js is not a directory.
Any help?
It Usually happens if you try to install a module while your packager is open.
Try to delete node_modules folder and close the packager.
Then reinstall everything by npm install in your project directory.
First close your JavaScript bundler (Metro bundler in my case) and restart the application. This will create fresh dependency graph. This should solve the issue.
Just restart the bundler - no need to delete the Node Modules folder
I came across this issue when adding and using react-native-elements when using VS Code and Android Studio emulator on Linux Mint
In VS Code I had a terminal running Expo with Metro Bundler via 'npm start' command. After installing the react-native-elements in the folder (using 'npm install --save react-native-elements') and adding the import into the .js file I got the "However, this package itself specifies a main module field that could not be resolved" error.
In my case, this just involved a ^C in the terminal session to stop the Metro bundler and then running 'npm start' again. There was no need to delete the node modules folder at all.
If you're still getting the error even after deleting the ./node_modules folder and running npm install again, try doing the install with the --update-binary flag, i.e npm install --update-binary. This should clear out and rebuild any previously built packages on your machine.
Please don't delete the node modules folder.
The bundler has least to deal with node modules folder.
Instead close all the terminals. If using VS-code close that also.
Close all the local host server ports and if possible restart the system.
This might solve the issue.
If anyone have same issue, and remove node_module not working. Then you can try remove all node_module, package lock and using yarn to install node_module instead npm. Hope this help
None of the solutions above helped me except for restarting my MacBook. Wasted 30 minutes trying to fix this issue as I couldn't believe restarting my computer could be a solution.

ENOENT: no such file or directory, bower_components\bootstrap\js\transition.js'

I'm just starting out with ember JS and my basic application seemed to be working like a charm, till I decided to add ember-cli-simple-auth through the ember cli. Since I have added this, I'm getting the error in the title and I have no clue how.
I know there is not much detail I have provided, but this is all I can think of. I tried uninstalling the ember-cli-simple-auth library but it doesn't help. Any help here would be really appreciated.
As the error indicate
ENOENT: no such file or directory, bower_components\bootstrap\js\transition.js'
there is no directory called bower_components, that means the dependencies are not installed.
To install dependencies, run
> bower install
command on the terminal from the root directory of the project where bower.json file is located.
This will install all the front-end dependencies in the bower_components folder.

Categories

Resources