Related
Upgraded my project's package.json & did some audit fixes. But now not able to run the build. Tried all the solutions from stackoverflow and other forums, none of them worked.
Here is my package.json
{
"name": "my-admin-frontend",
"version": "0.0.1",
"author": "",
"license": "ISC",
"scripts": {
"dev": "node server.js",
"build": "next build ./src",
"preinstall": "npx npm-force-resolutions",
"start": "npm run build && node server.js",
"coverage": "jest",
"lint": "npm run lint:js && npm run lint:styles",
"lint:js": "eslint \"./src/pages/*.js\" \"./src/components/**/*.js\" \"./src/adapters/**/*.js\" --fix",
"lint:styles": "stylelint \"./src/pages/*.js\" \"./src/components/**/*.styles.js\" \"./src/components/**/*.css\"",
"check-audit": "npm audit",
"check-quality": "npm run lint",
"eslint-report": "eslint --ext .jsx,.js -c .eslintrc.yml -o report.json ./src/components -f json",
"test": "npm run coverage -- --coverage --watchAll=false"
},
"dependencies": {
"#babel/plugin-proposal-class-properties": "^7.18.6",
"#date-io/date-fns": "^2.16.0",
"#material-ui/core": "^4.11.0",
"#material-ui/icons": "^4.11.3",
"#material-ui/lab": "^4.0.0-alpha.60",
"#material-ui/pickers": "^3.2.10",
"#microsoft/applicationinsights-web": "^2.8.9",
"#microsoft/microsoft-graph-client": "^3.0.4",
"applicationinsights": "^2.3.6",
"axios": "^1.2.1",
"body-parser": "^1.20.1",
"cookie": "^0.5.0",
"cookie-parser": "^1.4.6",
"date-fns": "^2.29.3",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.7",
"eslint-config-next": "^13.0.6",
"express": "^4.18.2",
"express-session": "^1.17.3",
"grapesjs": "^0.20.1",
"grapesjs-preset-webpage": "^1.0.2",
"helmet": "^6.0.1",
"hpp": "^0.2.3",
"identity-obj-proxy": "^3.0.0",
"jquery": "^3.6.1",
"js-cookie": "^3.0.1",
"jwt-decode": "^3.1.2",
"mobx": "^6.7.0",
"mobx-react": "^7.6.0",
"mobx-react-lite": "^3.4.0",
"next": "^13.0.6",
"next-images": "^1.8.4",
"node-fetch": "^3.3.0",
"passport": "^0.6.0",
"passport-azure-ad": "^4.3.4",
"postcss": "^8.4.19",
"prop-types": "^15.8.1",
"qrcode.react": "^3.1.0",
"react": "^18.2.0",
"react-device-detect": "^2.2.2",
"react-dom": "^18.2.0",
"react-idle-timer": "^5.4.2",
"react-player": "^2.11.0",
"react-responsive-carousel": "^3.2.23",
"react-screen-orientation": "0.0.4",
"react-test-renderer": "^18.2.0",
"styled-components": "^5.3.6"
},
"devDependencies": {
"#babel/plugin-proposal-decorators": "^7.20.5",
"#babel/plugin-proposal-optional-chaining": "^7.18.9",
"#jest/fake-timers": "29.3.1",
"#wojtekmaj/enzyme-adapter-react-17": "^0.8.0",
"autoprefixer": "^10.4.13",
"babel-eslint": "^7.2.3",
"babel-plugin-styled-components": "^2.0.7",
"contentful-management": "^10.22.0",
"dotenv": "^16.0.3",
"eslint": "^8.29.0",
"eslint-plugin-jsx-a11y": "^6.6.1",
"eslint-plugin-react": "^7.31.11",
"eslint-plugin-react-hooks": "^4.6.0",
"husky": "^8.0.2",
"jest": "^29.3.1",
"jest-enzyme": "^4.2.0",
"jest-puppeteer": "^6.1.1",
"junit-report-builder": "^3.0.1",
"pa11y-ci": "^3.0.1",
"puppeteer": "^19.4.0",
"stylelint": "^14.16.0",
"stylelint-config-recommended": "9.0.0",
"stylelint-config-styled-components": "0.1.1",
"stylelint-processor-styled-components": "1.10.0",
"tailwindcss": "^3.2.4"
},
"resolutions": {
"node-fetch": "2.6.7",
"object-path": "0.11.5",
"glob-parent": "5.1.2",
"set-value": "4.0.1",
"underscore": "1.13.2",
"ws": "7.4.6",
"jest-environment-jsdom": "27.4.6"
},
"husky": {
"hooks": {
"pre-push": "npm run check-quality"
}
},
"robots": {
"prod": {
"userAgent": [
"*"
],
"allow": [
"/"
]
},
"dev": {
"userAgent": [
"*"
],
"disallow": [
"*"
],
"noindex": [
"*"
]
}
}
}
My .eslintrc.yml
env:
browser: true
node: true
commonjs: true
es6: true
jest: true
extends:
- eslint:recommended
- plugin:react/recommended
- plugin:jsx-a11y/recommended
- next/core-web-vitals
parser: babel-eslint
parserOptions:
ecmaFeatures:
jsx: true
ecmaVersion: 2018
sourceType: module
plugins:
- react
- jsx-a11y
- react-hooks
rules:
react-hooks/rules-of-hooks:
- error
react-hooks/exhaustive-deps:
- warn
indent:
- error
- 4
semi:
- error
- never
no-console:
- error
- allow:
- error
- warn
- info
object-curly-spacing:
- error
- always
array-bracket-spacing:
- error
- never
jsx-quotes:
- error
- prefer-single
lines-between-class-members:
- error
- always
no-multiple-empty-lines:
- error
- max: 1
react/display-name:
- off
settings:
react:
version: detect
My .eslintignore
out/*
.next/*
Error I am getting is :
Linting and checking validity of types ...Error: Cannot find module 'escope'
Require stack:
C:\project test\MT-MyProject\node_modules\eslint\lib\api.js
I tried multiple changes in package.json but none worked.
I tried cleaning cache and installing all again but no luck.
have You tried to uninstall eslint library and then to try with npm i and then build
We just started up a new project and decided to do it in monorepo together with the existing one. The existing project is in Angular 10 with some parts in React. The new project is purely React.
It seems like everything is getting installed properly and even all the tests are passing. However, when I try to build or even run the application (for the old project) I am getting the following error:
~/PRIZ/dev/priz-fe/platform (PRZ-140) $ yarn run build --delete-output-path
internal/modules/cjs/loader.js:818
throw err;
^
Error: Cannot find module '/Users/shurikag/PRIZ/dev/priz-fe/platform/node_modules/#angular/cli/bin/ng'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:815:15)
at Function.Module._load (internal/modules/cjs/loader.js:667:27)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:60:12)
at internal/main/run_main_module.js:17:47 {
code: 'MODULE_NOT_FOUND',
requireStack: []
}
I feel like it is something dumb that I am missing. Also, the IDE is not complaining about anything.
The folder structure looks like this:
Root package.json:
{
"private": true,
"name": "priz-fe",
"workspaces": [
"platform",
"hub"
],
"packageManager": "yarn#3.1.1"
}
Platform package.json:
{
"name": "platform",
"version": "0.0.1",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"start-with-ssl": "node --max-old-space-size=4096 node_modules/#angular/cli/bin/ng serve --ssl --ssl-key docker/ssl/server.key --ssl-cert docker/ssl/server.pem",
"build": "node --max-old-space-size=4096 node_modules/#angular/cli/bin/ng build --configuration=production",
"test": "jest --maxConcurrency=2 --maxWorkers=2",
"update-snapshots": "jest --updateSnapshot",
"test-with-coverage": "ng test --code-coverage",
"eslint": "eslint 'src/app/**/*.{js,jsx,ts,tsx}'",
"eslint:fix": "eslint --fix 'src/app/**/*.{js,jsx,ts,tsx}'",
"lint": "yarn run eslint",
"tsc": "tsc --skipLibCheck --noEmit",
"e2e": "ng e2e",
"storybook": "start-storybook -s public -p 6006",
"build-storybook": "build-storybook",
"fmt": "prettier --write --config ./.prettierrc.yml '*.{js,yml}' 'src/app/**/*.{js,ts,tsx,scss,component.html}'",
"fmt:check": "prettier --config ./.prettierrc.yml --check '*.{js,yml}' 'src/app/**/*.{js,ts,tsx,scss,component.html}'",
"check": "yarn run fmt:check && yarn run tsc && yarn run lint",
"pre-commit": "yarn run fmt && yarn run check && yarn run test"
},
"jest": {
"transform": {
"^.+\\.tsx?$": "ts-jest",
"^.+\\.svg$": "jest-svg-transformer"
},
"moduleNameMapper": {
"\\.(css|less)$": "identity-obj-proxy"
},
"setupFiles": [
"jest-canvas-mock"
]
},
"private": true,
"dependencies": {
"#angular-redux/store": "^10.0.0",
"#angular/animations": "^12.2.5",
"#angular/cdk": "^12.2.5",
"#angular/common": "^12.2.5",
"#angular/compiler": "^12.2.5",
"#angular/core": "^12.2.5",
"#angular/flex-layout": "^9.0.0-beta.29",
"#angular/forms": "^12.2.5",
"#angular/material": "^12.2.5",
"#angular/platform-browser": "^12.2.5",
"#angular/platform-browser-dynamic": "^12.2.5",
"#angular/router": "^12.2.5",
"#auth0/angular-jwt": "^4.0.0",
"#date-io/date-fns": "1.3.13",
"#fortawesome/angular-fontawesome": "^0.6.1",
"#fortawesome/fontawesome-svg-core": "^1.2.28",
"#fortawesome/free-brands-svg-icons": "^5.13.0",
"#fortawesome/free-regular-svg-icons": "^5.13.0",
"#fortawesome/free-solid-svg-icons": "^5.13.0",
"#fortawesome/react-fontawesome": "^0.1.14",
"#material-ui/core": "^4.12.3",
"#material-ui/icons": "^4.11.2",
"#material-ui/lab": "^4.0.0-alpha.60",
"#material-ui/pickers": "^3.3.10",
"#sentry/browser": "^5.15.5",
"#stripe/react-stripe-js": "^1.5.0",
"#stripe/stripe-js": "^1.19.1",
"#types/hammerjs": "^2.0.39",
"angular-i18next": "^10.1.0",
"auth0-js": "^9.14.0",
"axios": "^0.21.0",
"core-js": "^3.6.5",
"date-fns": "^2.23.0",
"flux-standard-action": "^2.0.3",
"hammerjs": "^2.0.8",
"html-react-parser": "^1.2.6",
"i18next": "^20.2.1",
"i18next-http-backend": "^1.2.1",
"jest-svg-transformer": "^1.0.0",
"keycharm": "^0.4.0",
"lodash": "^4.17.15",
"mixpanel-browser": "^2.28.0",
"ngx-logger": "^4.1.9",
"ngx-mat-select-search": "^3.1.2",
"ngx-quill": "^13.0.1",
"object-hash": "^2.0.3",
"quill": "^1.3.7",
"quill-image-compress": "^1.2.16",
"quill-image-resize-module-react": "^3.0.0",
"react": "^17.0.1",
"react-avatar-editor": "^12.0.0",
"react-color": "^2.19.3",
"react-colorful": "^5.1.4",
"react-currency-format": "^1.0.0",
"react-dnd": "^14.0.4",
"react-dnd-html5-backend": "^14.0.2",
"react-dom": "^17.0.1",
"react-hook-form": "^7.15.2",
"react-i18next": "^11.8.13",
"react-keyed-flatten-children": "^1.3.0",
"react-player": "^2.9.0",
"react-query": "^3.13.6",
"react-quill": "^1.3.5",
"react-redux": "7.2.2",
"react-select": "^4.3.1",
"reduce-reducers": "^1.0.4",
"redux": "4.0.1",
"redux-actions": "^2.6.5",
"redux-devtools-extension": "^2.13.8",
"redux-saga": "^1.1.3",
"redux-thunk": "^2.3.0",
"reselect": "^4.0.0",
"rxjs": "^6.5.5",
"sass": "^1.39.0",
"svg-react-loader": "^0.4.6",
"tslib": "^2.0.0",
"uuid": "^8.3.1",
"vis-data": "^7.1.2",
"vis-network": "^9.0.4",
"vis-util": "^5.0.2",
"zone.js": "^0.11.4"
},
"devDependencies": {
"#angular-devkit/build-angular": "~0.1002.1",
"#angular/cli": "^12.2.5",
"#angular/compiler-cli": "^12.2.5",
"#angular/language-service": "^12.2.5",
"#babel/core": "^7.15.5",
"#storybook/addon-actions": "^6.1.11",
"#storybook/addon-controls": "^6.1.11",
"#storybook/addon-essentials": "^6.1.11",
"#storybook/addon-links": "^6.1.11",
"#storybook/react": "^6.1.11",
"#testing-library/react": "^11.2.6",
"#types/jest": "^26.0.23",
"#types/mixpanel-browser": "^2.23.1",
"#types/node": "^12.11.1",
"#types/react": "^17.0.0",
"#types/react-dom": "^17.0.0",
"#typescript-eslint/eslint-plugin": "^4.26.1",
"#typescript-eslint/parser": "^4.26.1",
"babel-loader": "^8.2.2",
"codelyzer": "^5.2.2",
"eslint": "^7.28.0",
"eslint-config-prettier": "^8.3.0",
"eslint-config-react-app": "^6.0.0",
"eslint-plugin-flowtype": "^5.7.2",
"eslint-plugin-import": "^2.23.4",
"eslint-plugin-jest": "^24.3.6",
"eslint-plugin-jest-dom": "^3.9.0",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-prettier": "^3.4.0",
"eslint-plugin-react": "^7.24.0",
"eslint-plugin-react-hooks": "^4.2.0",
"eslint-plugin-testing-library": "^4.6.0",
"identity-obj-proxy": "^3.0.0",
"jest": "^26.6.3",
"jest-canvas-mock": "^2.3.1",
"msw": "^0.35.0",
"msw-storybook-addon": "^1.3.0",
"prettier": "^2.3.1",
"protractor": "~7.0.0",
"react-test-renderer": "^17.0.2",
"redux-mock-store": "^1.5.4",
"ts-jest": "^26.5.6",
"ts-node": "~8.0.1",
"typescript": "4.3.5",
"webpack-bundle-analyzer": "^4.4.0"
},
"msw": {
"workerDirectory": "public"
},
"workspaces": {
"nohoist": [
"**"
]
}
}
I have a laravel 8 app and i'm running react on it. I have successfully built my application but now I need to compile my app for production, but it keeps failing whenever I run npm run prod. And I believe it has something to do with my react redux. It can't seem to handle that type of file configuration whenever I try to compile for production. Meanwhile npm run watch still works perfectly fine.
Here's the error:
C:\xampp\htdocs\pro-oms>npm run prod
> enlite_prime#1.4.3 prod C:\xampp\htdocs\pro-oms
> npm run production
> enlite_prime#1.4.3 production C:\xampp\htdocs\pro-oms
> cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --config=node_modules/laravel-mix/setup/webpack.config.js
Browserslist: caniuse-lite is outdated. Please run next command `yarn upgrade`
ERROR Failed to compile with 1 errors 17:32:19
error in ./resources/js/components/app.js
Module parse failed: Unexpected token (41:4)
You may need an appropriate loader to handle this file type.
| const render = messages => {
| ReactDOM.render(
> <Provider store={store}>
| <LanguageProvider messages={messages}>
| <ConnectedRouter history={history}>
# ./resources/js/app.js 15:0-30
# multi ./resources/js/app.js ./resources/sass/app.scss
3 assets
ERROR in ./resources/js/components/app.js 41:4
Module parse failed: Unexpected token (41:4)
You may need an appropriate loader to handle this file type.
| const render = messages => {
| ReactDOM.render(
> <Provider store={store}>
| <LanguageProvider messages={messages}>
| <ConnectedRouter history={history}>
# ./resources/js/app.js 15:0-30
# multi ./resources/js/app.js ./resources/sass/app.scss
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! enlite_prime#1.4.3 production: `cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --config=node_modules/laravel-mix/setup/webpack.config.js`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the enlite_prime#1.4.3 production script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\KALU KECHUKWU EA\AppData\Roaming\npm-cache\_logs\2020-12-21T16_32_26_115Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! enlite_prime#1.4.3 prod: `npm run production`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the enlite_prime#1.4.3 prod script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\username\AppData\Roaming\npm-cache\_logs\2020-12-21T16_32_26_214Z-debug.log
Here's my package.json:
{
"name": "enlite_prime",
"version": "1.4.3",
"description": "React.js fullstack web template for expert and experienced fullstack developer",
"private": true,
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --disable-host-check --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --config=node_modules/laravel-mix/setup/webpack.config.js"
},
"browserslist": [
"last 2 versions",
"> 1%",
"IE 10"
],
"lint-staged": {
"*.js": [
"npm run lint:eslint:fix",
"git add --force"
],
"*.json": [
"prettier --write",
"git add --force"
]
},
"pre-commit": "lint:staged",
"resolutions": {
"babel-core": "7.0.0-bridge.0"
},
"dllPlugin": {
"path": "node_modules/react-boilerplate-dlls",
"exclude": [
"#types/googlemaps",
"#types/markerclustererplus",
"autosuggest-highlight",
"chalk",
"compression",
"convert-source-map",
"cross-env",
"dotenv",
"etag",
"express",
"fs",
"ip",
"jsdom",
"minimist",
"mocha",
"moment",
"sanitize.css",
"serve-favicon",
"slick-carousel",
"tunnel-agent"
],
"include": [
"core-js",
"lodash",
"eventsource-polyfill"
]
},
"dependencies": {
"#babel/plugin-proposal-class-properties": "^7.8.3",
"#babel/plugin-proposal-export-default-from": "^7.2.0",
"#babel/plugin-proposal-object-rest-spread": "^7.2.0",
"#babel/polyfill": "7.4.3",
"#date-io/date-fns": "^1.3.11",
"#date-io/moment": "1.3.8",
"#material-ui/core": "^4.7.0",
"#material-ui/icons": "^4.5.1",
"#material-ui/lab": "^4.0.0-alpha.33",
"#material-ui/pickers": "^3.2.8",
"#types/googlemaps": "^3.38.1",
"#types/markerclustererplus": "^2.1.33",
"acorn": "^6.1.1",
"autosuggest-highlight": "^3.1.1",
"axios": "^0.19.0",
"bourbon": "^5.1.0",
"bourbon-neat": "^3.0.0",
"chalk": "^2.4.1",
"classnames": "^2.2.6",
"compression": "1.7.4",
"connected-react-router": "6.6.1",
"cross-env": "5.2.0",
"date-fns": "2.1.0",
"detect-browser": "^3.0.0",
"dotenv": "^6.0.0",
"downshift": "^1.31.12",
"draft-js": "^0.10.5",
"draft-js-inline-toolbar-plugin": "^3.0.0",
"draft-js-plugins-editor": "^2.1.1",
"draftjs-to-html": "^0.8.3",
"draftjs-to-markdown": "^0.5.1",
"express": "4.16.4",
"firebase": "^7.24.0",
"fontfaceobserver": "2.0.13",
"fs": "0.0.1-security",
"history": "4.7.2",
"hoist-non-react-statics": "3.0.1",
"immutable": "3.8.2",
"intl": "1.2.5",
"invariant": "2.2.4",
"ip": "1.1.5",
"jsdom": "^13.0.0",
"jss": "^10.0.0",
"jss-rtl": "^0.3.0",
"keycode": "^2.2.0",
"lodash": "^4.17.15",
"lru-memoize": "^1.0.2",
"marked": "^1.2.7",
"minimist": "1.2.0",
"mocha": "^6.1.4",
"moment": "^2.22.2",
"mui-datatables": "^2.13.1",
"prop-types": "15.7.2",
"rcolor": "^1.0.1",
"react": "16.8.6",
"react-anchor-link-smooth-scroll": "^1.0.11",
"react-autosuggest": "^9.3.4",
"react-calendar": "^2.17.4",
"react-clock": "^2.3.0",
"react-countup": "^3.0.3",
"react-dom": "16.8.6",
"react-draft-wysiwyg": "^1.12.13",
"react-dropzone": "^10.2.1",
"react-event-listener": "^0.6.1",
"react-google-maps": "^9.4.5",
"react-helmet": "6.0.0-beta",
"react-intl": "2.8.0",
"react-ionicons": "^2.1.6",
"react-jss": "^10.0.0",
"react-loadable": "5.5.0",
"react-loading-bar": "0.0.7",
"react-markdown": "^3.1.5",
"react-modal": "^3.4.4",
"react-number-format": "^3.3.4",
"react-popper": "^0.10.4",
"react-redux": "^7.0.2",
"react-router-dom": "^5.0.1",
"react-scrollspy": "^3.3.5",
"react-select": "^3.0.4",
"react-slick": "^0.23.1",
"react-spring": "^8.0.27",
"react-swipeable-views": "^0.12.13",
"react-syntax-highlighter": "^7.0.0",
"react-text-mask": "^5.3.2",
"recharts": "^1.4.2",
"recompose": "^0.28.2",
"redux": "4.0.1",
"redux-form": "8.2.0",
"redux-immutable": "4.0.0",
"redux-saga": "1.0.2",
"redux-saga-firebase": "^0.15.0",
"reselect": "4.0.0",
"sanitize.css": "8.0.0",
"serve-favicon": "^2.4.5",
"sinon": "^7.3.2",
"slick-carousel": "^1.8.1",
"tunnel-agent": "^0.6.0",
"warning": "4.0.2"
},
"devDependencies": {
"#babel/cli": "7.4.3",
"#babel/core": "7.4.3",
"#babel/plugin-proposal-class-properties": "7.4.0",
"#babel/plugin-syntax-dynamic-import": "7.2.0",
"#babel/plugin-transform-modules-commonjs": "7.4.3",
"#babel/plugin-transform-react-constant-elements": "7.2.0",
"#babel/plugin-transform-react-inline-elements": "7.2.0",
"#babel/preset-env": "7.4.3",
"#babel/preset-react": "7.0.0",
"#babel/register": "7.4.0",
"add-asset-html-webpack-plugin": "3.1.1",
"axios": "^0.19",
"babel-core": "7.0.0-bridge.0",
"babel-eslint": "10.0.1",
"babel-loader": "8.0.5",
"babel-plugin-dynamic-import-node": "2.2.0",
"babel-plugin-lodash": "3.3.4",
"babel-plugin-react-intl": "3.0.1",
"babel-plugin-react-transform": "3.0.0",
"babel-plugin-styled-components": "^1.10.0",
"babel-plugin-transform-react-remove-prop-types": "0.4.24",
"bootstrap": "^4.0.0",
"chai": "^4.2.0",
"circular-dependency-plugin": "5.0.2",
"compare-versions": "3.4.0",
"compression-webpack-plugin": "2.0.0",
"coveralls": "3.0.2",
"cross-env": "^7.0",
"css-loader": "3.4.2",
"enzyme": "3.7.0",
"enzyme-adapter-react-16": "1.6.0",
"enzyme-to-json": "3.3.4",
"eslint": "5.16.0",
"eslint-config-airbnb": "17.1.0",
"eslint-config-airbnb-base": "13.1.0",
"eslint-config-prettier": "4.1.0",
"eslint-import-resolver-webpack": "0.11.1",
"eslint-loader": "^2.1.1",
"eslint-plugin-flowtype": "^3.2.0",
"eslint-plugin-import": "2.17.0",
"eslint-plugin-jsx-a11y": "6.2.1",
"eslint-plugin-prettier": "3.0.1",
"eslint-plugin-react": "7.12.4",
"eslint-plugin-redux-saga": "1.0.0",
"eventsource-polyfill": "0.9.6",
"exports-loader": "0.7.0",
"file-loader": "3.0.1",
"happypack": "^5.0.1",
"html-loader": "0.5.5",
"html-webpack-plugin": "3.2.0",
"imports-loader": "0.8.0",
"jquery": "^3.2",
"laravel-mix": "^5.0.1",
"lint-staged": "8.1.5",
"lodash": "^4.17.19",
"ngrok": "3.1.1",
"node-plop": "0.18.0",
"node-sass": "^4.14.1",
"null-loader": "0.1.1",
"offline-plugin": "5.0.6",
"optimize-css-assets-webpack-plugin": "^5.0.0",
"plop": "2.3.0",
"popper.js": "^1.12",
"postcss-loader": "3.0.0",
"pre-commit": "1.2.2",
"prettier": "1.17.0",
"prismjs": "^1.11.0",
"raw-loader": "2.0.0",
"react-app-polyfill": "0.2.2",
"react-test-renderer": "16.8.6",
"resolve-url-loader": "^3.1.0",
"rimraf": "2.6.3",
"sass": "^1.15.2",
"sass-loader": "^8.0.0",
"sass-material-colors": "0.0.5",
"shelljs": "^0.8.3",
"style-loader": "0.23.1",
"stylelint": "10.0.1",
"stylelint-config-recommended": "2.2.0",
"stylelint-config-styled-components": "0.1.1",
"stylelint-processor-styled-components": "1.6.0",
"svg-url-loader": "2.3.2",
"terser-webpack-plugin": "1.2.3",
"url-loader": "1.1.2",
"webpack": "4.30.0",
"webpack-cli": "3.3.0",
"webpack-dev-middleware": "3.6.2",
"webpack-hot-middleware": "2.24.3 ",
"webpack-pwa-manifest": "4.0.0",
"whatwg-fetch": "3.0.0"
}
}
Here's my webpack.mix.js:
const mix = require('laravel-mix');
/*
|--------------------------------------------------------------------------
| Mix Asset Management
|--------------------------------------------------------------------------
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel application. By default, we are compiling the Sass
| file for the application as well as bundling up all the JS files.
|
*/
mix.webpackConfig({
output: {
publicPath: '/pro-oms/public/'
}
})
.react('resources/js/app.js', 'public/js')
.sass('resources/sass/app.scss', 'public/css');
I was able to fix my problem by replacing my .babelrc file with a babel.config.js file.
module.exports = {
presets: [
[
'#babel/preset-env',
{
modules: false,
},
],
'#babel/preset-react',
],
plugins: [
'styled-components',
'#babel/plugin-proposal-class-properties',
'#babel/plugin-syntax-dynamic-import',
'#babel/plugin-proposal-export-default-from'
]
};
I have been studying protractor and I have wrote some tests in with our production web app. Now I want to integrate this tests on our continuous integration. If the tests fail it should not continue to continuous release.
To achieve this I planned to run the same test in local server with the target version that is going to production. My project is coded in angularjs. My package.json file has a script to start a local server and other to test but I'm not being able to wait the server complete to up before running my tests.
Te question is: How can I run my tests in localhost web server?
My selenium config file
exports.config = {
framework: 'jasmine',
seleniumAdress: 'http://localhost:4444/wd/hub',
suites: {
fluxos: './specs/fluxos/spec.js',
validacoes: './specs/validacoes/spec.js'
},
capabilities: {
browserName: 'chrome'
},
}
My package.json
{
"scripts": {
"build": "gulp build:dev",
"build:hmg": "gulp build:hmg",
"build:hmgi": "gulp build:hmgInterno",
"build:prod": "gulp build:prod",
"coverage": "gulp test:build",
"lint": "./node_modules/.bin/eslint **/*.js",
"precommit": "npm run lint",
"prepush": "npm run coverage",
"start": "gulp serve:dev",
"start:hmg": "gulp serve:hmg",
"start:hmgi": "gulp serve:hmgInterno",
"start:prod": "gulp serve:prod",
"test": "gulp test",
"integration:validacoes": "gulp serve:prod && protractor ./tests/integration/conf.js --suite validacoes",
"integration:fluxos": "gulp serve:prod && protractor ./tests/integration/conf.js --suite fluxos"
},
"dependencies": {
"#uirouter/angularjs": "^1.0.15",
"#uirouter/core": "^5.0.17",
"angular": "^1.6.8",
"angular-cookies": "^1.6.8",
"angular-format-masks": "^1.0.2",
"angular-i18n": "^1.6.8",
"angular-input-masks": "^4.1.0",
"angular-sanitize": "^1.6.8",
"angular-spinner": "^1.0.1",
"angular-touch": "^1.6.8",
"angulartics": "^1.6.0",
"angulartics-google-tag-manager": "0.0.1",
"ng-accessibility-bar": "^1.2.3",
"spin.js": "^2.3.2"
},
"devDependencies": {
"angular-mocks": "^1.6.10",
"autoprefixer": "^8.1.0",
"babel-preset-env": "^1.6.1",
"babel-preset-es2015": "^6.24.1",
"browser-sync": "^2.23.7",
"browser-sync-spa": "^1.0.3",
"del": "^2.2.2",
"eslint": "^3.12.2",
"eslint-config-airbnb": "^13.0.0",
"eslint-config-angular": "^0.5.0",
"eslint-plugin-angular": "^1.6.1",
"eslint-plugin-import": "^2.11.0",
"eslint-plugin-jsx-a11y": "^2.0.0",
"eslint-plugin-react": "^6.8.0",
"gulp": "^3.9.1",
"gulp-cachebust": "0.0.6",
"gulp-clean-css": "^3.9.3",
"gulp-eslint": "^4.0.2",
"gulp-group-css-media-queries": "^1.2.2",
"gulp-gzip": "^1.4.2",
"gulp-htmlmin": "^3.0.0",
"gulp-if": "^2.0.1",
"gulp-imagemin": "^3.4.0",
"gulp-ng-annotate": "^2.1.0",
"gulp-ng-constant": "^2.0.0-3",
"gulp-postcss": "^7.0.1",
"gulp-rename": "^1.2.2",
"gulp-sass": "^3.2.1",
"gulp-sourcemaps": "^2.6.4",
"gulp-uglify": "^1.5.4",
"gulp-uglify-es": "^1.0.4",
"gulp-uncss": "^1.0.6",
"gulp-useref": "^3.1.5",
"husky": "^0.12.0",
"imagemin-gifsicle": "^5.2.0",
"imagemin-jpegtran": "^5.0.2",
"imagemin-optipng": "^5.2.1",
"imagemin-svgo": "^5.2.4",
"jasmine": "^2.99.0",
"jasmine-core": "^2.99.1",
"karma": "^1.7.1",
"karma-babel-preprocessor": "^6.0.1",
"karma-chrome-launcher": "^2.2.0",
"karma-coverage": "^1.1.1",
"karma-jasmine": "^1.1.1",
"karma-junit-reporter": "^1.2.0",
"karma-phantomjs-launcher": "^1.0.2",
"karma-spec-reporter": "0.0.26",
"karma-threshold-reporter": "^0.1.15",
"postcss-pxtorem": "^4.0.1",
"protractor": "^5.4.2",
"protractor-helper": "^3.7.0",
"run-sequence": "^1.2.2"
}
}
You could have a shell script to check if your server is up in an infinite loop, which exits once the server is up. Then you can run your tests
Example : ./wait-for.sh && npm test
The other way to do is containerize everything using docker and docker-compose, and then run tests.
I cant deploy my angular.js app to Heroku. I keep getting the following error. I can however run it locally with grunt serve or do a grunt build. I am using the heroku buildpack https://github.com/adamgoldstein/heroku-buildpack-nodejs-grunt-compass to get compass working. if I dont use the buildpack I get the warning 'Warning: Couldn't find the compass binary.'
remote: Running "wiredep:app" (wiredep) task
remote: Warning: Error: bootstrap-sass-official is not installed. Try running `bower install`. Use --force to continue.
remote:
remote: Aborted due to warnings.
remote:
remote:
remote: Execution Time (2015-09-17 14:11:30 UTC)
remote: loading tasks 332ms ▇▇▇▇▇▇▇▇▇ 18%
remote: clean:dist 130ms ▇▇▇▇ 7%
remote: wiredep:app 1.4s ▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ 76%
remote: Total 1.9s
remote:
remote:
remote: ! Push rejected, failed to compile Node.js app
I have cleaned and re-installed both my node_modules and my bower packages by running npm install and bower install.
This is my bower.json dependencies list:
"dependencies": {
"angular": "^1.3.0",
"bootstrap-sass-official": "^3.2.0",
"angular-animate": "^1.3.0",
"angular-aria": "^1.3.0",
"angular-cookies": "^1.3.0",
"angular-messages": "^1.3.0",
"angular-resource": "^1.3.0",
"angular-route": "^1.3.0",
"angular-sanitize": "^1.3.0",
"angular-touch": "^1.3.0",
"ngInfiniteScroll": "~1.2.0",
"angular-moment": "~0.9.2",
"userapp-angular": "~2.0.4",
"ui-bootstrap": "~0.12.1",
"angular-ui-router": "~0.2.13",
"modernizr": "~2.8.3",
"angular-bootstrap": "~0.13.0",
"angular-xeditable": "~0.1.9",
"ngtoast": "~1.5.2",
"restangular": "~1.5.1",
"jquery-bridget": "~1.1.0",
"angular-rangeslider": "~0.0.13",
"angular-auto-focus": "~1.0.3",
"angular-masonry": "~0.11.0",
"angular-masonry-directive": "*",
"angular-rt-popup": "~1.0.6"
},
"devDependencies": {
"angular-mocks": "^1.3.0"
},
and my package.json dependencies:
{
"name": "angularnews",
"version": "0.0.0",
"dependencies": {
"angular": "^1.3.x",
"bower": "~1.4.1",
"compass": "^0.1.1",
"express": "~4.12.3",
"generator-angular": "~0.11.1",
"generator-karma": "~1.0.0",
"grunt-cli": "~0.1.13",
"gzippo": "~0.2.0",
"morgan": "~1.5.2",
"yo": "~1.4.6"
},
"repository": {},
"devDependencies": {
"grunt": "^0.4.5",
"grunt-autoprefixer": "^2.0.0",
"grunt-concurrent": "^1.0.0",
"grunt-contrib-clean": "^0.6.0",
"grunt-contrib-compass": "^1.0.3",
"grunt-contrib-concat": "^0.5.0",
"grunt-contrib-connect": "^0.9.0",
"grunt-contrib-copy": "^0.7.0",
"grunt-contrib-cssmin": "^0.12.0",
"grunt-contrib-htmlmin": "^0.4.0",
"grunt-contrib-imagemin": "^0.9.2",
"grunt-contrib-jshint": "^0.11.0",
"grunt-contrib-uglify": "^0.7.0",
"grunt-contrib-watch": "^0.6.1",
"grunt-filerev": "^2.1.2",
"grunt-google-cdn": "^0.4.3",
"grunt-newer": "^1.1.0",
"grunt-ng-annotate": "^0.9.2",
"grunt-svgmin": "^2.0.0",
"grunt-usemin": "^3.0.0",
"grunt-wiredep": "^2.0.0",
"jshint-stylish": "^1.0.0",
"load-grunt-tasks": "^3.1.0",
"time-grunt": "^1.0.0"
},
"engines": {
"node": ">=0.10.0"
},
"scripts": {
"test": "grunt test",
"postinstall": "bower cache clean && bower install"
}
}
Any ideas?
Adding the https://github.com/heroku/heroku-buildpack-nodejs buildpack to heroku solved my problem.