After building AWS Amplify "Error: Invariant failed" - javascript

My project works in local without any problems. However, after building with AWS Amplify, an error such as the screenshot below occurs when problems occur when routing to other pages. (example "/" to "/page")
error
I don't know how to solve the above error because there is no problem in local.
"scripts": {
"start": "vite",
"build": "tsc && vite build",
"preview": "vite preview"
},
"dependencies": {
"#emotion/react": "^11.7.1",
"#emotion/styled": "^11.6.0",
"#ethersproject/providers": "^5.5.2",
"#mui/icons-material": "^5.4.1",
"#mui/material": "^5.2.8",
"#web3-react/core": "^6.1.9",
"#web3-react/injected-connector": "^6.0.7",
"bignumber.js": "^9.0.2",
"caver-js": "^1.6.8",
"moment": "^2.29.1",
"moment-timezone": "^0.5.34",
"react": "^18.0.0",
"react-device-detect": "^2.1.2",
"react-dom": "^18.0.0",
"react-ga": "^3.3.0",
"react-icons": "^4.3.1",
"react-loader-spinner": "^6.0.0-0",
"react-player": "^2.10.1",
"react-random-reveal": "^2.0.0",
"react-responsive": "^9.0.0-beta.8",
"react-router-dom": "^6.3.0",
"react-select": "^5.2.2",
"react-timer-hook": "^3.0.5",
"recoil": "^0.7.3-alpha.2",
"recoil-persist": "^4.0.0",
"styled-components": "^5.3.5",
"styled-reset": "^4.4.0",
"styled-system": "^5.1.5",
"swiper": "^8.1.5",
"usehooks-ts": "^2.4.0",
"vercel": "^24.2.3",
"web3": "^1.7.0"
},
"devDependencies": {
"#types/aos": "^3.0.4",
"#types/react": "^18.0.0",
"#types/react-dom": "^18.0.4",
"#types/react-responsive": "^8.0.5",
"#types/react-router-dom": "^5.3.3",
"#types/recoil": "^0.0.9",
"#types/styled-components": "^5.1.25",
"#types/styled-system": "^5.1.15",
"#types/swiper": "^6.0.0",
"#vitejs/plugin-react": "^1.3.0",
"aos": "^2.3.4",
"typescript": "^4.6.3",
"vite": "^2.9.9"
}

Related

How to fix Module build failed (from ./node_modules/babel-loader/lib/index.js)?

While trying to start the project I have the following error:
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'C:\Users\user\Documents\signatura-web\node_modules#babel\preset-es2015' imported from C:\Users\user\Documents\signatura-web\babel-virtual-resolve-base.js.
I have #babel packages installed (7th version) and babel-loader (8th version).
Here is package.json file:
{
"name": "signatura-web",
"version": "1.0.0",
"description": "",
"private": true,
"main": "index.js",
"scripts": {
"start": "webpack-dev-server --open --mode development --env dev",
"build": "webpack --mode production --env stage",
"build:prod": "webpack --mode production --env prod",
"serve": "node prodServer.js",
"test": "jest"
},
"repository": {
"type": "git",
"url": "https://Evgeny.Smirennikov#bitbucket.axamit.com/scm/sgt/signatura-web.git"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"#babel/core": "^7.10.3",
"#babel/plugin-proposal-class-properties": "^7.10.4",
"#babel/plugin-transform-runtime": "^7.11.5",
"#babel/preset-env": "^7.10.3",
"#babel/preset-es2015": "^7.0.0-beta.53",
"#babel/preset-react": "^7.10.1",
"#babel/preset-typescript": "^7.12.7",
"#svgr/webpack": "^5.4.0",
"#types/react-datepicker": "^4.3.3",
"#types/react-notifications-component": "^2.4.0",
"#types/react-redux": "^7.1.11",
"#types/react-router-dom": "^5.3.2",
"#types/yup": "^0.29.13",
"#typescript-eslint/eslint-plugin": "^5.12.1",
"#typescript-eslint/parser": "^5.12.1",
"babel-loader": "^8.1.0",
"copy-webpack-plugin": "^6.4.0",
"css-loader": "^3.6.0",
"eslint": "^8.21.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-jsx-a11y": "^6.6.1",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react": "^7.30.1",
"eslint-plugin-react-hooks": "^4.6.0",
"fork-ts-checker-webpack-plugin": "^6.0.4",
"html-loader": "^1.1.0",
"html-webpack-plugin": "^4.3.0",
"identity-obj-proxy": "^3.0.0",
"mini-css-extract-plugin": "^0.9.0",
"prettier": "^2.7.1",
"react-datetime": "2.16.3",
"react-router-redux": "^4.0.8",
"style-loader": "^1.2.1",
"stylus-loader": "^3.0.2",
"ts-loader": "^8.0.11",
"typescript": "^4.1.2",
"webpack": "^4.43.0",
"webpack-cli": "^3.3.12",
"webpack-dev-server": "^3.11.0"
},
"dependencies": {
"#beyonk/google-fonts-webpack-plugin": "^1.5.0",
"#hookform/resolvers": "^1.0.0",
"#logtail/browser": "^0.1.12",
"#material-ui/core": "^4.11.0",
"#material-ui/icons": "^4.9.1",
"#types/react-input-mask": "^3.0.1",
"animejs": "^3.2.1",
"axios": "^0.27.2",
"bootstrap": "^4.5.2",
"braintree-web-drop-in-react": "^1.2.1",
"classnames": "^2.2.6",
"compute-scroll-into-view": "^1.0.17",
"connected-react-router": "^6.8.0",
"copy-to-clipboard": "^3.3.1",
"date-fns": "^2.29.1",
"express": "^4.17.1",
"file-loader": "^6.1.0",
"font-awesome": "^4.7.0",
"google-map-react": "^2.1.9",
"headroom.js": "^0.11.0",
"html-react-parser": "^1.4.8",
"jest": "^26.6.3",
"moment": "^2.26.0",
"node-sass": "^4.14.1",
"openvidu-browser": "2.16.0",
"pdfjs-dist": "^3.0.279",
"prop-types": "^15.7.2",
"react": "^16.13.1",
"react-addons-css-transition-group": "^15.6.2",
"react-bootstrap": "^1.3.0",
"react-bootstrap-typeahead": "^5.1.1",
"react-datepicker": "^4.5.0",
"react-document-meta": "^3.0.0-beta.2",
"react-dom": "^16.13.1",
"react-dropzone": "^11.1.0",
"react-ga": "^3.3.0",
"react-hook-form": "^6.9.6",
"react-input-mask": "^2.0.4",
"react-modal": "^3.11.2",
"react-notifications-component": "^2.4.1",
"react-paginate": "^6.5.0",
"react-progressive-graceful-image": "^0.6.14",
"react-redux": "^7.2.2",
"react-router-dom": "^5.2.0",
"react-select": "^3.1.0",
"react-spinners": "^0.9.0",
"react-string-replace": "^0.4.4",
"react-tabs": "^3.1.1",
"react-test-renderer": "^17.0.1",
"reactstrap": "^8.5.1",
"redux": "^4.0.5",
"redux-devtools-extension": "^2.13.8",
"redux-persist": "^6.0.0",
"redux-persist-transform-filter": "^0.0.20",
"redux-saga": "^1.1.3",
"regenerator-runtime": "^0.13.7",
"sass-loader": "^10.0.2",
"stylus": "^0.54.8",
"yup": "^0.29.3"
},
"homepage": "./",
"jest": {
"moduleNameMapper": {
"\\.(css|styl|svg)$": "identity-obj-proxy"
}
}
}
Here is .babelrc file:
{
"presets": [
"#babel/preset-env",
"#babel/preset-react",
"#babel/preset-typescript",
"#babel/preset-es2015"
],
"plugins": [
[
"#babel/plugin-proposal-class-properties"
]
]
}
Among rules in webpack.config.js I have:
{
test: /\.(js|jsx|tsx)$/,
exclude: /node_modules/,
use: {
loader: "babel-loader",
},
},

React Native Alert Dialog background disappeared

I'm a beginner of React Native and try to build an APP with Expo, My Alert from React Native just had problem, the dialog background disappeared and I dont know what happened cause I even dont know how to change that.
Has anyone met this problem before? Here's my package.json and the screenshot.
Screenshot
{
"name": "educal-app",
"version": "1.0.0",
"scripts": {
"start": "expo start --dev-client",
"android": "expo run:android",
"ios": "expo run:ios",
"web": "expo start --web",
"eject": "expo eject",
"prepare": "husky install",
"lint": "eslint . --ext .ts,.tsx,.js,.jsx,.json",
"lint-and-fix": "eslint . --ext .ts,.tsx,.js,.jsx,.json --fix"
},
"dependencies": {
"#ethersproject/shims": "^5.6.0",
"#expo/vector-icons": "^13.0.0",
"#react-native-community/checkbox": "^0.5.12",
"#react-native-community/slider": "4.2.1",
"#react-native-picker/picker": "2.4.0",
"#react-navigation/bottom-tabs": "^6.3.1",
"#react-navigation/native": "^6.0.10",
"#react-navigation/native-stack": "^6.6.2",
"#reduxjs/toolkit": "^1.8.2",
"#rneui/base": "^4.0.0-rc.5",
"#rneui/themed": "^4.0.0-rc.5",
"#thetalabs/theta-js": "^0.0.67",
"#tradle/react-native-http": "^2.0.1",
"assert": "^1.5.0",
"axios": "^0.27.2",
"bignumber.js": "^9.1.0",
"browserify-zlib": "^0.1.4",
"buffer": "^6.0.3",
"console-browserify": "^1.2.0",
"constants-browserify": "^1.0.0",
"dns.js": "^1.0.1",
"domain-browser": "^1.2.0",
"ethers": "^5.6.9",
"events": "^1.1.1",
"expo": "~45.0.0",
"expo-av": "~11.2.3",
"expo-checkbox": "~2.1.0",
"expo-constants": "~13.1.1",
"expo-document-picker": "~10.2.1",
"expo-file-system": "~14.0.0",
"expo-font": "~10.1.0",
"expo-random": "^12.3.0",
"expo-secure-store": "~11.2.0",
"expo-splash-screen": "~0.15.1",
"expo-standard-web-crypto": "^1.4.0",
"expo-status-bar": "~1.3.0",
"expo-updates": "~0.13.3",
"expo-web-browser": "~10.2.1",
"firebase": "^9.8.1",
"formik": "^2.2.9",
"https-browserify": "^0.0.1",
"i": "^0.3.7",
"lottie-react-native": "5.0.1",
"metro": "^0.71.0",
"npm": "^8.16.0",
"papaparse": "^5.3.2",
"path-browserify": "^0.0.0",
"process": "^0.11.10",
"punycode": "^1.4.1",
"querystring-es3": "^0.2.1",
"react": "17.0.2",
"react-dom": "17.0.2",
"react-native": "0.68.2",
"react-native-anchor-carousel": "^4.0.1",
"react-native-collapsible": "^1.6.0",
"react-native-dialog": "^9.2.2",
"react-native-get-random-values": "^1.8.0",
"react-native-keyboard-aware-scroll-view": "^0.9.5",
"react-native-level-fs": "^3.0.1",
"react-native-loading-spinner-overlay": "^3.0.0",
"react-native-os": "^1.2.6",
"react-native-paper": "^4.12.1",
"react-native-phone-input": "^1.3.4",
"react-native-quick-base64": "^2.0.5",
"react-native-quick-crypto": "^0.4.5",
"react-native-rsa": "^0.0.3",
"react-native-safe-area-context": "4.2.4",
"react-native-screens": "~3.11.1",
"react-native-svg": "12.3.0",
"react-native-tcp": "^3.3.2",
"react-native-udp": "^2.7.0",
"react-native-virtualized-view": "^0.1.5",
"react-native-web": "0.17.7",
"react-native-webview": "11.18.1",
"react-native-youtube-iframe": "^2.2.2",
"react-redux": "^8.0.2",
"readable-stream": "^1.0.33",
"stream-browserify": "^1.0.0",
"string_decoder": "^0.10.31",
"timers-browserify": "^1.4.2",
"tty-browserify": "^0.0.0",
"url": "^0.10.3",
"util": "^0.10.4",
"victory-native": "^36.5.3",
"vm-browserify": "^0.0.4",
"web3": "^1.7.5",
"yup": "^0.32.11",
"expo-clipboard": "~3.0.1"
},
"devDependencies": {
"#babel/core": "^7.12.9",
"#commitlint/cli": "^17.0.3",
"#commitlint/config-conventional": "^17.0.3",
"#typescript-eslint/eslint-plugin": "^5.30.6",
"#typescript-eslint/parser": "^5.30.6",
"eslint": "^8.20.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-jsx-a11y": "^6.6.0",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react": "^7.30.1",
"eslint-plugin-react-hooks": "^4.6.0",
"husky": "^7.0.0",
"node-libs-react-native": "^1.2.1",
"prettier": "^2.7.1",
"react-native-svg-transformer": "^1.0.0",
"reactotron-react-native": "^5.0.2"
},
"private": true,
"husky": {
"hooks": {
"pre-commit": "lint-staged",
"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
}
},
"lint-staged": {
"*.{js,vue}": [
"eslint --fix"
]
}
}
Already solved, just clean the cache for expo APP in the phone, then everything is normal again.
removing <item name="android:textColor">#000000</item> from this file android/app/src/main/res/values/styles.xml solves the issue.

Aframe JS Error Could not load module '../GetIntrinsic'

After running npm start I receive the following error:
error: Processing of node_modules/aframe/dist/aframe-master.js failed. Error: Could not load module '../GetIntrinsic' from '/root/immerso-experience/node_modules/aframe/dist'. Make sure the file actually exists.
Here is the package.json
{
"name": "experience-engine",
"description": "Immerso Experience Engine",
"private": true,
"author": "Immerso",
"homepage": "https://immerso.io",
"version": "1.3.0",
"scripts": {
"start": "export DEVELOPMENT=true && brunch w -n -s -P 3000",
"build": "rm -rf public/ && brunch build --production && node -e 'require(\"./post-build.js\").readWriteSync()'",
"preinstall": "npx npm-force-resolutions || echo"
},
"jest": {
"globals": {
"$PROCESS_ENV_API_URL": "https://api.immersotours.com",
"$PROCESS_ENV_WS_API_URL": null,
"$PROCESS_ENV_RECAPTCHA_KEY": null,
"$PROCESS_ENV_PAYPAL_CLIENT_ID": "ARbzpX1BmPBEJ37OXso7sdXACVyufeAZ4ovJLziEILohedwfwNNvXIpelUJSG64U65QjDn_lfXHa4P3E",
"$PROCESS_ENV_AES_KEY": "secret-key",
"$PROCESS_ENV_DEVELOPMENT": true
}
},
"dependencies": {
"aframe": "^1.3.0",
"aframe-event-set-component": "^3.0.3",
"aframe-fit-texture-component": "^0.2.5",
"aframe-look-at-component": "1.0.0",
"aframe-particle-system-component": "^1.1.3",
"aframe-react": "^4.4.0",
"aframe-scene-look-controls": "^1.0.5",
"aframe-video-controls": "^0.3.0",
"animate.css": "^4.1.1",
"axios": "^0.21.1",
"bootstrap": "^4.6.0",
"braces": "^2.3.1",
"brunch": "^3.0.0",
"crypto-js": "^4.0.0",
"dotenv": "^8.2.0",
"howler": "^2.2.0",
"json": "^11.0.0",
"kill-port-process": "^2.3.0",
"prerender-node": "^3.2.5",
"process-env-brunch": "^1.4.6",
"prop-types": "^15.8.1",
"react": "^16.13.1",
"react-async-script-loader": "^0.3.0",
"react-bootstrap": "^1.4.3",
"react-device-detect": "^1.17.0",
"react-dom": "^16.14.0",
"react-ga": "^3.3.0",
"react-google-invisible-recaptcha": "^0.2.11",
"react-google-login": "^5.2.2",
"react-helmet": "^6.1.0",
"react-i18next": "^9.0.10",
"react-intl": "^5.12.1",
"react-modal": "^3.12.1",
"react-router-dom": "^5.2.0",
"react-scripts": "^4.0.0",
"react-share": "^4.4.0",
"react-tooltip": "^4.2.13",
"sass-brunch": "^3.0.0",
"socket.io": "^3.1.1",
"ssri": "^8.0.1",
"use-strict": "^1.0.1",
"websocket": "^1.0.31"
},
"devDependencies": {
"#babel/core": "^7.12.13",
"#babel/plugin-transform-runtime": "^7.12.15",
"#babel/plugin-transform-strict-mode": "^7.12.13",
"#babel/preset-env": "^7.12.13",
"#babel/preset-react": "^7.12.13",
"#babel/register": "^7.12.13",
"#babel/runtime-corejs2": "^7.12.13",
"auto-reload-brunch": "^2.7.1",
"babel-brunch": "^7.0.1",
"babel-jest": "^26.6.3",
"babel-preset-latest": "^6.24.1",
"babel-preset-react": "^6.24.1",
"clean-css-brunch": "^3.0.0",
"esm": "^3.2.25",
"express": "^4.17.1",
"fingerprint-brunch": "^2.0.7",
"fs": "0.0.1-security",
"npm-force-resolutions": "0.0.3",
"react-addons-test-utils": "^15.6.2",
"react-notifications-component": "^3.0.3",
"riteway": "^6.2.1",
"uglify-es-brunch": "^1.0.5"
},
"main": ".eslintrc.js",
"repository": {
"type": "git",
"url": "git+https://ImmersoTech#bitbucket.org/ImmersoTech/immerso-experience.git"
},
"license": "ISC"
}
NPM version 7.19.1
Node version 16.5.0
Note: I am using a deprecated library called react-aframe which may or may not affect it. I imagine it might since it is so old. I have tried looking in github and stackoverflow for similar issues but could not find it
I ran this command
grep GetIntrinsic node_modules/aframe/dist/aframe-master.js
to see where GetIntrinsic is used and it is imported a couple of times with require(). From looking at the function itself it seems to just get a value based off of a key from the INTRINSINCS object.

npm ERR! 404 Not Found: #babel/preset-vue#^7.1.0

I am developing simple website by using Ruby on Rails and Vue.js and I having trouble with starting local server. When I run on the terminal npm run dev it gives me 2 errors:
This dependency was not found:
* /Users/muchacho/RoRProjects/crm/crm-vue/node_modules/webpack-dev-server/client/index.js?http://localhost:8080 in multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-server.js ./src/main.js
and second one:
This relative module was not found:
* ./src/main.js in multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-server.js ./src/main.js
I thought that there are some missing dependencies or packages, so I run on the terminal npm install, it gives me another error:
npm ERR! 404 Not Found: #babel/preset-vue#^7.1.0
I tried to install #babel/preset-vue, but there is no such package.
My question is how to fix this problem, is it problem with node.js, vue.js or with npm ?
If you need additional information or file - I can upload source code.
UPD
Here is my package.json file:
{"name": "crm-vue",
"version": "1.0.0",
"description": "Frontend to crm",
"author": "",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run",
"test": "npm run unit",
"lint": "eslint --ext .js,.vue src test/unit",
"build": "node build/build.js"
},
"dependencies": {
"#babel/preset-react": "^7.0.0",
"#fortawesome/fontawesome-svg-core": "^1.2.4",
"#fortawesome/free-solid-svg-icons": "^5.3.1",
"#fortawesome/vue-fontawesome": "^0.1.1",
"axios": "^0.18.0",
"bootstrap-vue": "^2.0.0-rc.11",
"i": "^0.3.6",
"npm": "^6.4.1",
"vue": "^2.5.17",
"vue-axios": "^2.1.3",
"vue-router": "^3.0.1",
"vue-sweetalert2": "^1.5.3",
"vuejs-datepicker": "^1.5.3",
"vuejs-paginator": "^2.0.2",
"vuelidate": "^0.7.4",
"vuex": "^3.0.1",
"vuex-persistedstate": "^2.5.4"
},
"devDependencies": {
"#babel/core": "^7.1.2",
"#babel/preset-env": "^7.1.0",
"autoprefixer": "^9.1.5",
"babel-core": "^6.26.3",
"babel-eslint": "^10.0.1",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-loader": "^8.0.4",
"babel-plugin-istanbul": "^5.0.1",
"babel-plugin-syntax-jsx": "^6.18.0",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-plugin-transform-vue-jsx": "^3.5.0",
"babel-preset-env": "^1.7.0",
"babel-preset-stage-2": "^6.22.0",
"babel-preset-stage-3": "^6.24.1",
"babel-preset-vue": "^2.0.2",
"chai": "^4.2.0",
"chalk": "^2.0.1",
"copy-webpack-plugin": "^4.0.1",
"cross-env": "^5.0.1",
"css-loader": "^1.0.0",
"eslint": "^5.6.1",
"eslint-config-standard": "^12.0.0",
"eslint-friendly-formatter": "^4.0.1",
"eslint-loader": "^2.1.1",
"eslint-plugin-import": "^2.14.0",
"eslint-plugin-node": "^7.0.1",
"eslint-plugin-promise": "^4.0.1",
"eslint-plugin-standard": "^4.0.0",
"eslint-plugin-vue": "^4.7.1",
"extract-text-webpack-plugin": "^3.0.0",
"file-loader": "^2.0.0",
"friendly-errors-webpack-plugin": "^1.6.1",
"html-webpack-plugin": "^3.2.0",
"inject-loader": "^4.0.1",
"karma": "^3.0.0",
"karma-coverage": "^1.1.1",
"karma-mocha": "^1.3.0",
"karma-phantomjs-launcher": "^1.0.2",
"karma-phantomjs-shim": "^1.4.0",
"karma-sinon-chai": "^2.0.2",
"karma-sourcemap-loader": "^0.3.7",
"karma-spec-reporter": "0.0.32",
"karma-webpack": "^3.0.5",
"mocha": "^5.2.0",
"node-notifier": "^5.1.2",
"node-sass": "^4.9.3",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"ora": "^3.0.0",
"phantomjs-prebuilt": "^2.1.14",
"portfinder": "^1.0.17",
"postcss-import": "^12.0.0",
"postcss-loader": "^3.0.0",
"postcss-url": "^8.0.0",
"rimraf": "^2.6.0",
"sass-loader": "^7.1.0",
"semver": "^5.5.1",
"shelljs": "^0.8.2",
"sinon": "^6.3.4",
"sinon-chai": "^3.2.0",
"uglifyjs-webpack-plugin": "^2.0.1",
"url-loader": "^1.1.1",
"vue-loader": "^15.4.2",
"vue-style-loader": "^4.1.2",
"vue-template-compiler": "^2.5.17",
"webpack": "^4.20.2",
"webpack-bundle-analyzer": "^3.0.2",
"webpack-cli": "^3.1.2",
"webpack-dev-server": "^3.1.9",
"webpack-merge": "^4.1.4"
},
"engines": {
"node": ">= 6.0.0",
"npm": ">= 3.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
In my point of view, there was internet connection trouble, so packages didn't downloaded properly. Issue was solved by reinstalling Vue.js and other packages.

Pulled from remote repo and getting: "Parsing error: The keyword 'import' is reserved"

I get the following error:
ERROR in ./src/main.js
error Parsing error: The keyword 'import' is reserved
/Users/staging/Desktop/sourcetree/viewer_web/src/main.js:1:1
import Vue from 'vue'
For some reason the ES6 feature in my project is not being recognized?
I'm using Node 5.0 and this is my package.json:
{
"name": "istaging-viewer",
"description": "A Vue.js project",
"author": "Alex <alexchen.info#gmail.com>",
"private": true,
"scripts": {
"dev": "node build/dev-server.js",
"build": "rimraf dist && webpack --progress --hide-modules --config build/webpack.prod.conf.js",
"test": "karma start build/karma.conf.js --single-run"
},
"dependencies": {
"aframe": "mozvr/aframe#dev",
"bootstrap": "^3.3.6",
"jquery": "^2.2.1",
"lodash": "^4.4.0",
"vue": "^1.0.16",
"vue-resource": "^0.7.0",
"vue-router": "^0.7.11"
},
"devDependencies": {
"babel-core": "^6.0.0",
"babel-loader": "^6.0.0",
"babel-plugin-transform-runtime": "^6.0.0",
"babel-preset-es2015": "^6.0.0",
"babel-preset-stage-2": "^6.0.0",
"babel-runtime": "^5.8.0",
"bootstrap-webpack": "0.0.5",
"connect-history-api-fallback": "^1.1.0",
"css-loader": "^0.23.1",
"eslint": "^1.10.3",
"eslint-friendly-formatter": "^1.2.2",
"eslint-loader": "^1.2.0",
"eslint-plugin-html": "^1.3.0",
"eventsource-polyfill": "^0.9.6",
"exports-loader": "^0.6.3",
"express": "^4.13.3",
"extract-text-webpack-plugin": "^1.0.1",
"file-loader": "^0.8.4",
"function-bind": "^1.0.2",
"html-loader": "^0.4.3",
"html-webpack-plugin": "^2.8.1",
"imports-loader": "^0.6.5",
"inject-loader": "^2.0.1",
"jasmine-core": "^2.4.1",
"json-loader": "^0.5.4",
"karma": "^0.13.15",
"karma-jasmine": "^0.3.6",
"karma-phantomjs-launcher": "^1.0.0",
"karma-spec-reporter": "0.0.24",
"karma-webpack": "^1.7.0",
"less": "^2.6.0",
"less-loader": "^2.2.2",
"phantomjs-prebuilt": "^2.1.3",
"rimraf": "^2.5.0",
"style-loader": "^0.13.0",
"stylus": "^0.53.0",
"stylus-loader": "^1.5.1",
"url-loader": "^0.5.7",
"vue-hot-reload-api": "^1.2.0",
"vue-html-loader": "^1.0.0",
"vue-loader": "^8.1.3",
"vue-style-loader": "^1.0.0",
"webpack": "^1.12.2",
"webpack-dev-middleware": "^1.4.0",
"webpack-hot-middleware": "^2.6.0"
}
}
What's a possible solution?
I thought it was a problem caused by eslint so I installed it globally but it didn't solve the problem.
You should add this to your .eslintrc file:
"parser": "babel-eslint"
This will fix your issue.
Node still uses common.js for modules. Take a look here https://nodejs.org/en/docs/es6/ for all the es6 supported features in node. If you want to use es6 imports you may have to use babel-node

Categories