i have a package.json as this:
{
"name": "dashboard",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"apexcharts": "^3.8.4",
"axios": "^0.19.0",
"core-js": "^2.6.5",
"lodash": "^4.17.15",
"moment": "^2.24.0",
"vue": "^2.6.10",
"vue-apexcharts": "^1.5.1",
"vue-numerals": "^3.0.5",
"vue-router": "^3.1.3",
"vue-virtual-scroll-list": "^1.4.4",
"vuetify": "2.1.13",
"vuex": "^3.1.2",
"vuex-map-fields": "^1.3.6",
"vuex-persist": "^2.2.0"
},
"devDependencies": {
"#mdi/font": "^3.8.95",
"#vue/cli-plugin-babel": "^3.9.0",
"#vue/cli-plugin-eslint": "^3.9.0",
"#vue/cli-service": "^3.9.0",
"babel-eslint": "^10.0.1",
"eslint": "^5.16.0",
"eslint-plugin-vue": "^5.0.0",
"sass": "^1.17.4",
"sass-loader": "^7.1.0",
"typeface-roboto": "^0.0.75",
"vue-cli-plugin-vuetify": "^2.0.5",
"vue-template-compiler": "^2.6.10",
"vuetify-loader": "^1.2.2"
}
}
As I did the setup for this project via Vue cli I selected that options as Eslint, Babel and so on are incapsulated in the package.json. I put them in several files now: .eslintrc.js, babel.config.js, and postcss.config.js. Can I do this just like that - creating these files and remove the contents from the package.json?
The contents of the postcss.config.js is this:
module.exports = {
plugins: {
autoprefixer: {},
},
};
When I build this I always get this message:
Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: No PostCSS Config found in: /Users/dev/Sites/dev/src/node_modules/vuetify/src/directives/ripple
at /Users/dev/Sites/dev/src/resources/views/dashboard/node_modules/postcss-load-config/src/index.js:91:15
# /Users/dev/Sites/dev/src/node_modules/vuetify/src/directives/ripple/VRipple.sass 4:14-329 14:3-18:5 15:22-337
Before that I see this message at top:
65% building 852/919 modules 67 active /Users/dev/Sites/dev/src/resources/views/dashboard/node_modules/axios/lib/core/transformData.jsYou did not set any plugins, parser, or stringifier. Right now, PostCSS does nothing. Pick plugins for your case on https://www.postcss.parts/ and use them in postcss.config.js.
Does this mean that I need to use the sass-loader which is specified in the package.json in the postcss.config.js as well? I am bit puzzled, because on another project I have the same configuration and no other content in the postcss.config.js and I do not get error messages about missing plugins. Thanks!
I advise you to try launching vue ui in the console. After that in the "dependencies" category, you have to try to uninstall packages for CSS-processors and then reinstall it. Probably some of these packages are corrupted.
Related
I am using Vuexy Dashboard in my project, Vuexy comes in with Vue 2, so I am trying to upgrade it to Vue 3, after fixing some errors, I'm stuck on this one, any help is much appreciated.
Thank you.
This is my package.json file :
{
"name": "vuexy-vuejs-react-html-laravel-admin-dashboard-template",
"version": "6.4.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve --skip-plugins #vue/cli-plugin-eslint",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"#casl/ability": "4.1.6",
"#casl/vue": "1.1.1",
"#vue/cli-plugin-eslint": "^5.0.4",
"#vue/compat": "^3.1.0-0",
"#vue/composition-api": "^1.6.1",
"#vueuse/core": "4.0.0",
"animate.css": "4.1.1",
"apexcharts": "^3.35.2",
"assert": "^2.0.0",
"axios": "^0.27.2",
"axios-mock-adapter": "1.19.0",
"bootstrap": "4.6.0",
"bootstrap-vue": "2.21.1",
"buffer": "^6.0.3",
"chart.js": "2.9.4",
"core-js": "3.8.1",
"echarts": "4.8.0",
"jsonwebtoken": "8.5.1",
"leaflet": "1.6.0",
"portal-vue": "2.1.7",
"postcss-rtl": "1.7.3",
"prismjs": "^1.28.0",
"stream": "0.0.2",
"swiper": "5.4.5",
"uuid": "8.3.2",
"vue-perfect-scrollbar": "0.2.1",
"vue-prism-component": "1.1.1",
"vue-quill-editor": "3.0.6",
"vue-ripple-directive": "2.0.1",
"vue-router": "3.4.9",
"vue-select": "3.11.2",
"vue-slider-component": "3.2.11",
"vue-sweetalert2": "4.1.1",
"vue-toastification": "1.7.8",
"vue-tour": "1.5.0",
"vue-tree-halower": "1.8.3",
"vue2-leaflet": "2.5.2",
"vuedraggable": "2.24.3",
"vuex": "3.6.0"
},
"devDependencies": {
"#babel/core": "^7.12.16",
"#babel/eslint-parser": "^7.12.16",
"#vue/cli-plugin-babel": "^5.0.4",
"#vue/cli-plugin-router": "^5.0.4",
"#vue/cli-plugin-vuex": "^5.0.4",
"#vue/cli-service": "^5.0.4",
"#vue/compiler-sfc": "^3.1.0-0",
"#vue/eslint-config-airbnb": "^6.0.0",
"#vuepress/plugin-medium-zoom": "^1.7.1",
"eslint": "^7.32.0",
"eslint-plugin-import": "^2.25.3",
"eslint-plugin-vue": "^8.0.3",
"eslint-plugin-vuejs-accessibility": "^1.1.1",
"sass": "1.32.*",
"sass-loader": "^10.1.0"
}
}
And these are the errors I'm getting while running npm run serve :
ERROR in ./node_modules/#babel/runtime/helpers/esm/nonIterableSpread.js 1:0-43
Module not found: Error: Can't resolve 'core-js/modules/es.error.cause.js' in 'Desktop\consigliere-vue-laravel\e-commerce\frontend\node_modules\#babel\runtime\helpers\esm'
After searching a lot, what works for me was what I found in this blog post:
https://blog.csdn.net/Missbelover/article/details/123221351
Basically, what you need to do is...
Remove all your node_modules dependencies.
npm rm -rf node_modules
Install core-js first.
npm install --save core-js
Finally install everything else.
npm install
yarn install
After this everything should work as expected, a least for me is working now.
Have a good day!
My issue was having 2 projects that differ because they use yarn and npm. I made the mistake of installing jest globally with yarn so had conflicts with my jest version. I ran yarn remove global jest and it worked.
I'm trying to build a React Native app with some navigation, and i got this error whenever i build it, i'm using expo to build the app :
Android Bundling failed 6098ms
While trying to resolve module `#react-navigation/core` from file `/Users/laurent/Documents/Delivery/Tek3/DEV/B-DEV-501-LYN-5-1-redditech-laurent.cazette/node_modules/#react-navigation/native/src/ResourceSavingSceneView.js`, the package `/Users/laurent/Documents/Delivery/Tek3/DEV/B-DEV-501-LYN-5-1-redditech-laurent.cazette/node_modules/#react-navigation/core/package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`/Users/laurent/Documents/Delivery/Tek3/DEV/B-DEV-501-LYN-5-1-redditech-laurent.cazette/node_modules/#react-navigation/core/lib/module/index.js`. Indeed, none of these files exist:
* /Users/laurent/Documents/Delivery/Tek3/DEV/B-DEV-501-LYN-5-1-redditech-laurent.cazette/node_modules/#react-navigation/core/lib/module/index.js(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
* /Users/laurent/Documents/Delivery/Tek3/DEV/B-DEV-501-LYN-5-1-redditech-laurent.cazette/node_modules/#react-navigation/core/lib/module/index.js/index(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
I think I've already installed all dependencies, but here is my package.json in case I forgot anything :
{
"main": "index.js",
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"web": "expo start --web",
"start": "react-native start"
},
"dependencies": {
"#react-native-community/masked-view": "^0.1.11",
"#react-navigation/core": "react-navigation/core",
"#react-navigation/native": "react-navigation/native",
"#react-navigation/stack": "5.9.0",
"expo": "~42.0.1",
"expo-splash-screen": "~0.11.2",
"expo-status-bar": "~1.0.4",
"expo-updates": "~0.8.1",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "0.63.4",
"react-native-gesture-handler": "~1.10.2",
"react-native-paper": "^4.9.2",
"react-native-reanimated": "~2.2.0",
"react-native-safe-area-context": "^3.3.2",
"react-native-screens": "~3.4.0",
"react-native-svg": "^12.1.1",
"react-native-unimodules": "0.14.10",
"react-native-vector-icons": "^8.1.0",
"react-native-web": "^0.17.5",
"react-navigation": "^4.4.4",
"react-navigation-stack": "^2.10.4",
"styled-components": "^5.3.1",
"styled-system": "^5.1.5"
},
"devDependencies": {
"#babel/core": "^7.9.0"
},
"private": true
}
I've already tried to update metro.config.js :
const { getDefaultConfig } = require('expo/metro-config');
module.exports = {
resolver: {
/* resolver options */
sourceExts: ['jsx', 'js', 'ts', 'tsx'],
},
maxWorkers: 2,
transformer: {
getTransformOptions: async () => ({
transform: {
experimentalImportSupport: false,
inlineRequires: false,
},
}),
},
};
module.exports = getDefaultConfig(__dirname);
Do you guys have any idea on what's wrong ?
Why do you have it like this?
"#react-navigation/core": "react-navigation/core",
"#react-navigation/native": "react-navigation/native",
They need to be correct version numbers. Follow the documentation on official website to install the packages:
https://reactnavigation.org/docs/getting-started
https://reactnavigation.org/docs/stack-navigator/
expo install react-native-screens react-native-safe-area-context react-native-gesture-handler
yarn add #react-navigation/native #react-navigation/stack
And remove "#react-navigation/core": "react-navigation/core" from your package.json.
Try this:
Install react-navigation module.
Re-build your project.
Restart the packager by stopping the current
packager and then starting the packager again with react-native
start.
Unable to resolve module 'react-navigation'
I'm using react native expo. The app works fine on android, but when run on the web gets a compilation error. It was working fine in before, but I suspect this started after installing some new package.
/ReactNativeFrontend/node_modules/#codler/react-native-keyboard-aware-scroll-view/lib/KeyboardAwareHOC.js 13:12
Module parse failed: Unexpected token (13:12)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| } from 'react-native'
| import { isIphoneX } from 'react-native-iphone-x-helper'
> import type { KeyboardAwareInterface } from './KeyboardAwareInterface'
|
| const _KAM_DEFAULT_TAB_BAR_HEIGHT: number = isIphoneX() ? 83 : 49
My babel config
module.exports = function(api) {
api.cache(true);
return {
presets: ['babel-preset-expo'],
};
};
My package.json
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
},
"dependencies": {
"#codler/native-base": "^2.14.2",
"#material-ui/core": "^4.11.0",
"#react-native-community/art": "^1.2.0",
"#react-native-community/async-storage": "^1.11.0",
"#react-native-community/datetimepicker": "^2.4.0",
"#react-native-community/masked-view": "0.1.10",
"#react-native-community/voice": "^1.1.6",
"#risingstack/react-easy-state": "^6.3.0",
"axios": "^0.19.2",
"easy-peasy": "^3.3.1",
"expo": "~38.0.8",
"expo-camera": "^8.3.1",
"expo-constants": "^9.1.1",
"expo-font": "~8.2.1",
"expo-gl": "^8.3.1",
"expo-image-picker": "^8.3.0",
"expo-permissions": "^9.0.1",
"expo-pixi": "^1.2.0",
"expo-speech": "~8.2.1",
"expo-status-bar": "^1.0.2",
"i18n-js": "^3.7.1",
"lodash.memoize": "^4.1.2",
"native-base": "^2.13.12",
"proxy": "^1.0.2",
"react": "~16.11.0",
"react-dom": "~16.11.0",
"react-instantsearch-native": "^6.7.0",
"react-native-chatbot": "0.0.1-alpha.12",
"react-native-datepicker": "^1.7.2",
"react-native-dialogflow": "^3.2.2",
"react-native-elements": "^2.0.4",
"react-native-fade-in-view": "^1.1.0",
"react-native-gesture-handler": "~1.6.0",
"react-native-gifted-chat": "^0.16.3",
"react-native-localization": "^2.1.6",
"react-native-localize": "^1.4.1",
"react-native-no-flicker-image": "^1.0.2",
"react-native-paper": "^4.0.1",
"react-native-reanimated": "~1.9.0",
"react-native-safe-area-context": "~3.0.7",
"react-native-screens": "~2.9.0",
"react-native-signature-capture": "^0.4.10",
"react-native-star-rating": "^1.1.0",
"react-native-vector-icons": "^7.0.0",
"react-native-voice": "^0.3.0",
"react-native-web": "~0.11.7",
"react-navigation": "^4.4.0",
"react-navigation-stack": "^2.8.2",
"react-navigation-tabs": "^2.9.0",
"styled-components": "^5.1.1"
},
"devDependencies": {
"#babel/core": "^7.8.6",
"#babel/preset-env": "^7.11.0",
"babel-preset-expo": "~8.1.0",
"react-native": "^0.63.2"
},
"private": true,
"rnpm": {
"assets": "./assets/fonts"
},
"proxy": "http://localhost:19002"
}
How to add appropriate loaders, or identify the package causing this issue.
I had this exact same issue, I found a solution today.
Thanks to this kind user on the expo forums.
judipuak's post
Install the react-native-keyboard-aware-scroll-view package into your node_modules with yarn on npm
Navigate to native base/dist/src/basic and open Content.js
Find var _reactNativeKeyboardAwareScrollView=require('#codler/react-native-keyboard-aware-scroll-view')
Change this to var _reactNativeKeyboardAwareScrollView=require('react-native-keyboard-aware-scroll-view') (remove the #codler)
Update:
Here's a more permanent solution
courtesy of patarapolw
I downgrade two things, and upgrade one thing, in package.json
{
"dependencies": {
"native-base": "~2.11",
"react-native-web": "~0.11"
},
"resolutions": {
"react-native-keyboard-aware-scroll-view": "^0.9.0"
},
}
This is a native-base library problem. While You are using it's some Components there might error occur. I found that this error is not occurring in 2.11 or it's less version so try to install that specific version
npm install native-base#2.11
Hey all I am just trying to get a simple test running and I keep running into this error after running "yarn test" which is using jest.
Plugin 0 specified in "/Users/Documents/Dev/appname/node_modules/babel-preset-react-native/index.js" provided an invalid property of "default" (While processing preset: "/Users/Documents/Dev/appname/node_modules/babel-preset-react-native/index.js")
at Plugin.init (node_modules/babel-core/lib/transformation/plugin.js:131:13)
at Function.normalisePlugin (node_modules/babel-core/lib/transformation/file/options/option-manager.js:152:12)
at node_modules/babel-core/lib/transformation/file/options/option-manager.js:184:30
at Array.map (<anonymous>)
at Function.normalisePlugins (node_modules/babel-core/lib/transformation/file/options/option-manager.js:158:20)
at OptionManager.mergeOptions (node_modules/babel-core/lib/transformation/file/options/option-manager.js:234:36)
at node_modules/babel-core/lib/transformation/file/options/option-manager.js:265:14
at node_modules/babel-core/lib/transformation/file/options/option-manager.js:323:22
at Array.map (<anonymous>)
at OptionManager.resolvePresets (node_modules/babel-core/lib/transformation/file/options/option-manager.js:275:20)
Here is my package.json, what am I missing, im sure its a configuration issue and not a test issue.
{
"name": "appname",
"version": "0.0.1",
"private": true,
"rnpm": {
"assets": [
"resources/fonts"
]
},
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"axios": "^0.18.0",
"lodash": "^4.17.10",
"react": "16.4.1",
"react-native": "0.56.0",
"react-native-autocomplete-input": "^3.5.0",
"react-native-code-push": "^5.4.2",
"react-native-elements": "^1.0.0-beta2",
"react-native-form-validator": "^0.2.0",
"react-native-image-pan-zoom": "^2.1.9",
"react-native-image-zoom-viewer": "^2.2.18",
"react-native-material-dropdown": "^0.11.1",
"react-native-remote-svg": "^1.3.0",
"react-native-vector-icons": "^5.0.0",
"react-native-version-number": "^0.3.5",
"react-navigation": "^2.11.2"
},
"devDependencies": {
"babel-jest": "23.4.2",
"babel-preset-react-native": "^5",
"jest": "23.5.0",
"react-test-renderer": "16.4.1"
},
"jest": {
"preset": "react-native"
}
}
don't know if you solved that already but I had the same issue and I was able to make things work again with RN 0.56. I changed this:
"babel-preset-react-native": "^5",
to
"babel-preset-react-native": "4.0.0",
here's the full discussion around the issue: https://github.com/storybooks/storybook/issues/3897
if the above breaks your react-native env, another solution would be to install babel-bridge:
npm install babel-core#7.0.0-bridge.0 --save-dev
So I am trying the run the environment scripts and APIs for the development side of the website my team is building and every time I run ng build for each environment API this error pops up:
Example of the error that is being produced
now here is my pack.json file:
{
"name": "clark-gateway",
"version": "1.0.0-beta.4.0",
"description": "",
"main": "app.js",
"scripts": {
"start": "npm run gulp-tsc",
"build": "node_modules/.bin/gulp tsc",
"gulp-tsc": "node_modules/.bin/gulp start",
"lint": "node_modules/.bin/tslint --project ./src/**",
"pack": "npm run build && cp ./package.json ./dist && cd ./dist && zip -r ../dist.zip ./* & cd ..",
"zip": "cp ./package.json ./dist && cd ./dist && zip -r ../dist.zip ./* & cd ..",
"deploy": "eb deploy CLARK-Gateway-Production --label CLARK-Gateway-v$(node -p \"require('./package.json').version\")",
"document": "node_modules/.bin/typedoc --out ./docs/ ./src/"
},
"author": "",
"license": "ISC",
"devDependencies": {
"#types/express-jwt": "0.0.38",
"#types/jsonwebtoken": "^7.2.3",
"#types/raven": "^2.1.3",
"#types/request-promise": "^4.1.39",
"#types/express": "^4.0.39",
"#types/node": "^8.0.32",
"concurrently": "^3.5.0",
"gulp": "^3.9.1",
"gulp-nodemon": "^2.2.1",
"gulp-typescript": "^3.1.7",
"pre-commit": "^1.2.2",
"tslint": "^5.7.0",
"tslint-config-airbnb": "^5.3.0",
"typedoc": "^0.9.0",
"typescript": "^2.3.4"
},
"dependencies": {
"#cyber4all/clark-entity": "^2.1.0-beta.0.4",
"#cyber4all/clark-taxonomy": "^2.0.0",
"#types/socket.io": "^1.4.33",
"aws-sdk": "^2.147.0",
"body-parser": "^1.17.1",
"cookie-parser": "^1.4.3",
"cors": "^2.8.4",
"dotenv": "^4.0.0",
"express": "^4.15.2",
"express-http-proxy": "^1.1.0",
"express-jwt": "^5.3.0",
"helmet": "^3.6.1",
"jsonwebtoken": "^7.4.1",
"morgan": "^1.9.0",
"multer": "^1.3.0",
"ngx-cookie": "^2.0.1",
"raven": "^2.3.0",
"request": "^2.85.0",
"serverless-http": "^1.5.3",
"socket.io": "^2.1.0"
},
"pre-commit": [
"lint"
],
"prettier": {
"singleQuote": true,
"trailingComma": "all"
}
}
Things that I have tried:
- I have deleted the node modules folder numerous times (3 times to be exact)
- npm installed 3 times also deleted the pack-lock.json file
- Also I did the recommended commands and it gave me more errors such as
PS C:\Clark-Development\CLARK-Environment-master\cart-service> ng
build
Local workspace file ('angular.json') could not be found.
Error: Local workspace file ('angular.json') could not be found.
at WorkspaceLoader._getProjectWorkspaceFilePath (C:\Clark-Development\CLARK-Environment-master\cart-service\node_modules\#angular\cli\models\workspace-loader.js:37:19)
at WorkspaceLoader.loadWorkspace (C:\Clark-Development\CLARK-Environment-master\cart-service\node_modules\#angular\cli\models\workspace-loader.js:24:21)
at BuildCommand._loadWorkspaceAndArchitect (C:\Clark-Development\CLARK-Environment-master\cart-service\node_modules\#angular\cli\models\architect-command.js:180:32)
at BuildCommand. (C:\Clark-Development\CLARK-Environment-master\cart-service\node_modules\#angular\cli\models\architect-command.js:47:25)
at Generator.next ()
at C:\Clark-Development\CLARK-Environment-master\cart-service\node_modules\#angular\cli\models\architect-command.js:7:71
at new Promise ()
at __awaiter (C:\Clark-Development\CLARK-Environment-master\cart-service\node_modules\#angular\cli\models\architect-command.js:3:12)
at BuildCommand.initialize (C:\Clark-Development\CLARK-Environment-master\cart-service\node_modules\#angular\cli\models\architect-command.js:46:16)
at Object. (C:\Clark-Development\CLARK-Environment-master\cart-service\node_modules\#angular\cli\models\command-runner.js:87:23)
This error occurs after I execute the command npm install --save-dev #angular/core#latest
So it turns out I was running the wrong commands, which explains why its saying it needs angular-cli to use the command I was using. I used npm start which worked flawlessly