I have a website hosted on S3 with CloudFront. I already deploy several times and work but now it does not update the s3 bucket after I deploy. I've used npm audit fix to check the dependencies and fixing the dependencies. Furthermore, I've used npm cache clean --force and deleted the package-lock.json and after that I deployed it, but it didn't work either.
Command use for deployment:
npm run build && aws s3 sync build/ s3://host
package.json
{
"name": "dashboard",
"version": "0.1.0",
"private": true,
"dependencies": {
"#fnando/cpf": "^0.1.1",
"#rocketseat/unform": "^1.5.1",
"axios": "^0.19.0",
"date-fns": "^2.14.0",
"history": "^4.9.0",
"immer": "^3.2.0",
"lodash": "^4.17.20",
"polished": "^3.4.1",
"prop-types": "^15.7.2",
"react": "^16.9.0",
"react-datepicker": "^2.16.0",
"react-dom": "^16.9.0",
"react-icons": "^3.7.0",
"react-redux": "^7.1.0",
"react-router-dom": "^5.1.2",
"react-scripts": "^3.4.3",
"react-select": "^3.0.4",
"react-skeleton-loader": "^1.0.4",
"react-toastify": "^5.3.2",
"reactotron-react-js": "^3.3.2",
"reactotron-redux": "^3.1.1",
"reactotron-redux-saga": "^4.2.2",
"redux": "^4.0.4",
"redux-persist": "^5.10.0",
"redux-saga": "^1.0.5",
"styled-components": "^4.3.2",
"yup": "^0.27.0"
},
"scripts": {
"start": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-app-rewired test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"babel-plugin-root-import": "^6.4.1",
"customize-cra": "^0.5.0",
"prettier": "^1.18.2",
"react-app-rewired": "^2.1.3"
}
}
It's likely Cloudfront caching the previous deployment.
You can either change your cache settings to disable caching entirely, or run an invalidation on your distribution to effectively purge the cache.
aws cloudfront create-invalidation --distribution-id distribution_ID --paths "/*"
Related
I am facing trouble compiling my react/next project which I am trying to run using VScode. After 'npm start', whenever I try to make any changes, it just freezes, doesn't compile and not reflecting to the dashboard. The same project is running for my teammates. So I believe this doesn't concern with the code but my system itself.
Below are my system config:
MacOS Monterey (Apple M2)
tried Node Version v14.15.1, v14.17.0, v14.21.3, v16.19.1, v19.6.1
deleted and re-installed node_modules
What else can be the reason? Let me know if you need any other details.
Below is my package.json file
{
"name": "eflexjobs",
"version": "0.1.0",
"private": true,
"dependencies": {
"#material-ui/core": "^4.11.3",
"#material-ui/icons": "^4.11.2",
"#material-ui/lab": "^4.0.0-alpha.56",
"#material-ui/styles": "^4.11.3",
"#testing-library/jest-dom": "^5.11.9",
"#testing-library/react": "^11.2.5",
"#testing-library/user-event": "^12.8.1",
"axios": "^0.21.1",
"eslint": "^8.6.0",
"formik": "^2.2.6",
"globby": "^12.0.2",
"html-react-parser": "^1.4.9",
"lite-youtube-embed": "^0.2.0",
"moment": "^2.29.1",
"netlify-cms-app": "^2.15.59",
"next": "^11.1.3",
"next-seo": "^5.1.0",
"next-sitemap": "^1.6.203",
"prettier": "^2.5.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-facebook-pixel": "^1.0.4",
"react-gtm-module": "^2.0.11",
"react-lite-youtube-embed": "^2.1.3",
"react-loader": "^2.4.7",
"react-loader-spinner": "^4.0.0",
"react-markdown": "^4.2.2",
"react-player": "^2.9.0",
"react-slick": "^0.28.1",
"react-spinners": "^0.12.0",
"react-toastify": "^7.0.4",
"reactjs-freshchat": "^1.3.2",
"sass": "^1.41.1",
"sass-loader": "^12.1.0",
"slick-carousel": "^1.8.1",
"styled-components": "^5.3.3",
"swiper": "^6.8.1",
"typeface-raleway": "0.0.75",
"use-debounce": "^6.0.1",
"web-vitals": "^1.1.0",
"window-or-global": "^1.0.1",
"yup": "^0.32.9"
},
"scripts": {
"dev": "next dev",
"build": "node public/main.js && next build",
"postbuild": "next-sitemap",
"start": "next start",
"test": "react-scripts test",
"eject": "react-scripts eject",
"server": "node public/main.js"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {}
}
There Should be Many reasons like:
1.Dependencies
2.Configuration issues.
3.Version incompatibility.
4.Network issues
If it is a next.js project, it is run by default using npm run dev or yarn dev command.
If you have any issues, please share the package.json file.
Turns out that the auto-save mode was not on. I had to save it after every change. And now it's working.
I got some error message 'Cannot find module ..\acorn.js' when write 'npm start'
package.json
{
"name": "eats-mate-frontend",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.16.4",
"#testing-library/react": "^13.3.0",
"#testing-library/user-event": "^13.5.0",
"acorn": "^8.8.0",
"axios": "^0.27.2",
"bootstrap": "^5.1.3",
"react": "^18.2.0",
"react-bootstrap": "^2.4.0",
"react-dom": "^18.2.0",
"react-kakao-maps-sdk": "^1.1.1",
"react-persist": "^1.0.2",
"react-redux": "^8.0.2",
"react-responsive-carousel": "^3.2.23",
"react-router-dom": "^6.3.0",
"react-scripts": "5.0.1",
"redux": "^4.2.0",
"redux-persist": "^6.0.0",
"redux-promise": "^0.6.0",
"redux-thunk": "^2.4.1",
"save": "^2.5.0",
"slick-carousel": "^1.8.1",
"source-map": "^0.7.4",
"styled-components": "^5.3.5",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"#types/acorn": "^6.0.0"
}
}
Below is my node_modules' contents that start with 'a'
I cannot find node_modules\acorn , as terminal's error message said.
But I already done 'npm install --save acorn' and no new folders related to acorn has been created in node_modules.
Even I removed package-lock.json file and write 'npm install', it didn't work to solve the problem.
Please help!
delete your node_modules folder, and your package-lock.json, and then run npm install
first you should remove acorn from package and npm install once you finish try to install it alone.
Currently working on a project, the project works perfectly fine after npm start and can function normally. However, after any changes made in VS Code, it seems localhost not listening any changes anymore. The workaround is to refresh the browser anytime changes has been made. Does anyone have experienced above issue?
I have tried to remove package-lock.json and node_modules, re-install packages by npm install, nothing helped.
Here is my package.json
{
"name": "crypto-dashboard",
"version": "0.1.0",
"private": true,
"homepage": "https://nickng852.github.io/crypto-dashboard/",
"dependencies": {
"#craco/craco": "^6.3.0",
"#reduxjs/toolkit": "^1.7.1",
"#testing-library/jest-dom": "^5.14.1",
"#testing-library/react": "^11.2.7",
"#testing-library/user-event": "^12.8.3",
"autoprefixer": "^9.8.7",
"axios": "^0.22.0",
"chart.js": "^3.6.0",
"firebase": "^9.1.2",
"html-react-parser": "^1.4.2",
"millify": "^4.0.0",
"moment": "^2.29.1",
"node-sass": "^6.0.1",
"postcss": "^7.0.38",
"react": "^17.0.2",
"react-chartjs-2": "^3.3.0",
"react-click-away-listener": "^2.0.5",
"react-dom": "^17.0.2",
"react-redux": "^7.2.6",
"react-router-dom": "^6.2.2",
"react-scripts": "4.0.3",
"redux": "^4.1.2",
"tailwindcss": "npm:#tailwindcss/postcss7-compat#^2.2.16",
"web-vitals": "^1.1.2"
},
"scripts": {
"start": "craco start",
"build": "craco build",
"test": "craco test",
"eject": "react-scripts eject",
"predeploy": "npm run build"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
I'm building an ASP.NET Core app with React in Visual Studio. When I run npm run build, I get the following error:
Creating an optimized production build...
Failed to compile.
EEXIST: file already exists, mkdir 'G:\My Drive\[redacted]\ClientApp]\build\static\js'
I've deleted the build folder and run again, but it creates it and then complains again that it already exists.
Here's my package.json:
"name": "partssearchtool",
"version": "0.1.0",
"private": true,
"dependencies": {
"#emotion/react": "^11.7.1",
"#emotion/styled": "^11.6.0",
"#mui/icons-material": "^5.3.1",
"#mui/material": "^5.4.0",
"bootstrap": "^4.1.3",
"chart.js": "^3.6.0",
"jquery": "^3.4.1",
"merge": "^1.2.1",
"oidc-client": "^1.9.0",
"react": "^17.0.2",
"react-chartjs-2": "^4.0.0",
"react-dom": "17.0.2",
"react-router-bootstrap": "^0.25.0",
"react-router-dom": "^5.1.2",
"react-scripts": "^3.4.1",
"reactstrap": "^8.4.1",
"recharts": "^2.1.6",
"rimraf": "^2.6.2",
"synp": "^1.9.9"
},
"devDependencies": {
"ajv": "^6.9.1",
"cross-env": "^5.2.0",
"eslint": "^6.8.0",
"eslint-config-react-app": "^5.2.0",
"eslint-plugin-flowtype": "^4.6.0",
"eslint-plugin-import": "^2.20.1",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-react": "^7.18.3",
"nan": "^2.14.1",
"typescript": "^3.7.5"
},
"eslintConfig": {
"extends": "react-app"
},
"scripts": {
"start": "rimraf ./build && react-scripts start",
"build": "react-scripts build",
"test": "cross-env CI=true react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"lint": "eslint ./src/"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
The app was built with create-react-app.
Everything works fine locally. However, I kept getting this error from Netlify
I've tried to install react-scripts but it didn't work. Same error causing Netlify deployment failure.
Netlify Log Details -
$ yarn build
yarn run v1.22.17
$ cd client && npm run build
my-app#0.1.0 build
react-scripts build
sh: 1: react-scripts: not found
error Command failed with exit code 127.
───────────────────────────────────────────────────────────────
Error message
Command failed with exit code 127: yarn build
Error location
In Build command from Netlify app:
yarn build
package.json file in my client folder
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"proxy": "http://localhost:8888",
"dependencies": {
"#testing-library/jest-dom": "^5.11.4",
"#testing-library/react": "^11.1.0",
"#testing-library/user-event": "^12.1.10",
"axios": "^0.24.0",
"dotenv": "^10.0.0",
"firebase": "^9.1.2",
"lodash.memoize": "^4.1.2",
"node-sass": "^6.0.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-redux": "^7.2.5",
"react-router-dom": "^5.3.0",
"react-scripts": "^4.0.3",
"react-stripe-checkout": "^2.6.3",
"redux": "^4.1.1",
"redux-logger": "^3.0.6",
"redux-persist": "^6.0.0",
"redux-saga": "^1.1.3",
"redux-thunk": "^2.4.0",
"reselect": "^4.0.0",
"web-vitals": "^0.2.4",
"workbox-background-sync": "^5.1.3",
"workbox-broadcast-update": "^5.1.3",
"workbox-cacheable-response": "^5.1.3",
"workbox-core": "^5.1.3",
"workbox-expiration": "^5.1.3",
"workbox-google-analytics": "^5.1.3",
"workbox-navigation-preload": "^5.1.3",
"workbox-precaching": "^5.1.3",
"workbox-range-requests": "^5.1.3",
"workbox-routing": "^5.1.3",
"workbox-strategies": "^5.1.3",
"workbox-streams": "^5.1.3"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
Is there anything wrong with my dependencies?