For a fresh project vue-cal is installing fine in Nuxt2. But when I try to install it in one of my old project it is showing undefined in the dates and weeks.
I think one of my package is affecting the vue-cal project. Can you check the package file and tell me which package may be the issue for this problem?
"dependencies": {
"#braid/vue-formulate": "^2.4.3",
"#chenfengyuan/vue-countdown": "^1.1.5",
"#grpc/grpc-js": "^1.6.2",
"#hexdigital/nuxt-intercom": "0.0.9",
"#improbable-eng/grpc-web": "^0.14.0",
"#mercury-labs1/augmentive-node-proto": "^1.3.68",
"#mercury-labs1/augmentive-proto": "^1.3.68",
"#netsells/nuxt-hotjar": "^0.1.2",
"#nuxtjs/auth": "^4.9.1",
"#nuxtjs/axios": "^5.13.6",
"#nuxtjs/dotenv": "^1.4.1",
"#nuxtjs/gtm": "^2.4.0",
"#nuxtjs/robots": "^2.5.0",
"#nuxtjs/sentry": "^4.3.5",
"#nuxtjs/svg-sprite": "^0.4.12",
"#riophae/vue-treeselect": "^0.4.0",
"#tryghost/content-api": "^1.5.13",
"#twilio/rtc-diagnostics": "^1.0.0",
"algoliasearch": "^4.11.0",
"axios": "^0.21.1",
"babel-runtime": "^6.26.0",
"buefy": "^0.9.4",
"chart.js": "^2.9.4",
"defu": "^5.0.0",
"disable-scroll": "^0.5.1",
"flickity": "^2.2.1",
"getstream": "^7.4.0",
"google-protobuf": "^3.14.0-rc.1",
"grpc-web": "^1.2.1",
"grpc-web-node-http-transport": "0.0.1",
"gsap": "^3.7.0",
"instantsearch.css": "^7.4.5",
"lodash": "^4.17.21",
"mapbox-gl": "^2.6.1",
"moment": "^2.28.0",
"moment-timezone": "^0.5.34",
"nuxt": "^2.0.0",
"nuxt-buefy": "^0.4.8",
"nuxt-facebook-pixel-module": "^1.5.0",
"nuxt-logrocket": "^1.5.2",
"posthog-js": "^1.20.0",
"screenfull": "^5.0.2",
"socket.io-client": "1.4.8",
"stream-chat": "^6.2.0",
"timezones-list": "^1.1.1",
"twilio-chat": "^4.0.0",
"twilio-video": "^2.18.0",
"v-calendar": "^2.3.0",
"vue-cal": "^3.11.0",
"vue-chartjs": "^3.5.1",
"vue-core-video-player": "^0.2.0",
"vue-device-detector": "^1.1.6",
"vue-flickity": "^1.2.1",
"vue-instantsearch": "^4.1.1",
"vue-line-clamp": "^1.3.2",
"vue-loading-skeleton": "^1.1.9",
"vue-moment": "^4.1.0",
"vue-progress": "^0.2.1",
"vue-radial-progress": "^0.3.2",
"vue-read-more": "^1.1.1",
"vue-select": "^3.11.0",
"vue-slider-component": "^3.2.11",
"vue-social-sharing": "^3.0.8",
"vue-switches": "^2.0.1",
"vue-tel-input": "^4.4.2",
"vue2-editor": "^2.10.2",
"vue2-perfect-scrollbar": "^1.5.0",
"vue2-smooth-scroll": "^1.6.0",
"vue2-timepicker": "^1.1.5",
"vuejs-paginate": "^2.1.0"
},
"devDependencies": {
"#babel/core": "^7.13.1",
"#babel/plugin-proposal-class-properties": "^7.13.0",
"#babel/plugin-transform-runtime": "^7.13.4",
"#babel/preset-env": "^7.12.17",
"#nuxtjs/style-resources": "^1.0.0",
"#types/google-protobuf": "^3.15.5",
"cypress": "^7.5.0",
"eslint-plugin-cypress": "^2.11.3",
"node-sass": "^4.14.1",
"nuxt-purgecss": "^1.0.0",
"sass-loader": "^8.0.2",
"start-server-and-test": "^1.12.2"
}
OP fixed the issue by upgrading the nuxt and vue modules!
Related
i'm using multiple Dependencies in Expo RN app, the project has been successfully done year ago and now when i try to build and run it again, i'm getting this error: child.isClassAccessorProperty is not a function.
i've tried cleaning and reinstall node_modules also checked expo community and no solution so far.
Detailed log issue:
Failed building JavaScript bundle. node_modules/react-native-gesture-handler/src/handlers/gestures/gesture.ts: /Users/ilies/Desktop/LinkAll/node_modules/react-native-gesture-handler/src/handlers/gestures/gesture.ts: child.isClassAccessorProperty is not a function
and this is my package.json:
"dependencies": {
"#expo/config-plugins": "^5.0.4",
"#react-native-firebase/messaging": "^17.1.0",
"#react-native-masked-view/masked-view": "^0.2.8",
"#react-navigation/bottom-tabs": "^6.5.5",
"#react-navigation/drawer": "^6.6.0",
"#react-navigation/material-bottom-tabs": "^6.2.13",
"#react-navigation/native": "^6.1.4",
"#react-navigation/stack": "^6.3.13",
"big-integer": "^1.6.51",
"deprecated-react-native-prop-types": "^4.0.0",
"expo": "~47.0.12",
"expo-credit-card": "^0.0.5",
"expo-google-app-auth": "^10.0.0",
"expo-google-sign-in": "^11.0.0",
"expo-intent-launcher": "^10.3.1",
"expo-linear-gradient": "^12.0.1",
"expo-modules-core": "^1.1.1",
"expo-notifications": "^0.17.0",
"expo-splash-screen": "^0.17.5",
"expo-status-bar": "~1.4.2",
"expo-updates": "^0.15.6",
"firebase": "^9.17.1",
"i": "^0.3.7",
"lottie-react-native": "^5.1.5",
"moment": "^2.29.4",
"moment-range": "^4.0.2",
"patch-package": "^6.5.1",
"react": "^18.1.0",
"react-dom": "^18.2.0",
"react-hook-form": "^7.43.1",
"react-html-email": "^3.0.0",
"react-moment": "^1.1.3",
"react-native": "^0.70.5",
"react-native-calendars": "^1.1293.0",
"react-native-credit-card": "^0.1.9",
"react-native-credit-card-input": "^0.4.1",
"react-native-draggable-calendar": "^1.0.2",
"react-native-fast-image": "^8.6.3",
"react-native-gesture-handler": "^2.9.0",
"react-native-interactable": "^2.0.1",
"react-native-linear-gradient": "^2.6.2",
"react-native-map-link": "^2.10.2",
"react-native-maps": "^1.4.0",
"react-native-paper": "^5.2.0",
"react-native-reanimated": "^2.14.4",
"react-native-safe-area-context": "^4.5.0",
"react-native-screens": "^3.20.0",
"react-native-sendgrid": "^1.0.2",
"react-native-snap-carousel": "^3.9.1",
"react-native-svg": "^13.8.0",
"react-native-swiper": "^1.6.0",
"react-native-web": "^0.18.12",
"react-navigation": "^4.4.4",
"rn-credit-card": "^1.0.4",
"text-encoding": "^0.7.0"},
"devDependencies": {
"#babel/core": "^7.12.9" }
I have created a repo that contains some files in javascript and some in typescript it works fine. but when I installed this repo into another project which is purely javascript in that case when I import any file which is written in typescript I get the error Unable to resolve the path to module 'myRepo/sum'.
NOTE: The app which is consuming myRepo could not setup typescript, it should work with myRepo changes
Solution Tried: added postinstall hook as tsc but that doesn't work
sharing my package.json which is fetching myRepo written in js and ts
{
"name": "test-repo",
"private": true,
"sideEffects": false,
"scripts": {
"test:jest": "npx jest",
"build:dev": "BABEL_ENV=development webpack --config webpack/webpack.dev.js",
"build:devWatch": "BABEL_ENV=development webpack --watch true --config webpack/webpack.dev.js",
"start:dev": "nf start & npm run build:dev"
},
"devDependencies": {
"#babel/cli": "^7.0.0",
"#babel/core": "^7.10.4",
"#babel/plugin-syntax-async-generators": "^7.8.4",
"#babel/plugin-syntax-dynamic-import": "^7.8.3",
"#babel/plugin-transform-async-to-generator": "^7.10.4",
"#babel/plugin-transform-regenerator": "^7.10.4",
"#babel/plugin-transform-runtime": "^7.13.10",
"#babel/preset-env": "^7.10.4",
"#babel/preset-react": "^7.10.4",
"#babel/register": "^7.10.4",
"#fullhuman/postcss-purgecss": "^2.3.0",
"#tanepiper/robots-webpack-plugin": "^0.4.0",
"#testing-library/react": "^11.2.5",
"babel-eslint": "^9.0.0",
"babel-jest": "^23.4.2",
"babel-loader": "^8.0.6",
"babel-plugin-dynamic-import-node": "^2.3.3",
"babel-plugin-root-import": "^6.1.0",
"babel-plugin-source-map-support": "^2.0.1",
"babel-plugin-transform-imports": "^1.5.1",
"babel-preset-airbnb": "^5.0.0",
"cssnano": "^4.1.10",
"cypress": "^4.12.1",
"cypress-image-snapshot": "^3.1.1",
"cypress-log-to-output": "^1.0.8",
"dotenv": "^6.2.0",
"enzyme": "^3.4.2",
"enzyme-adapter-react-16": "^1.2.0",
"enzyme-to-json": "^3.3.4",
"eslint": "^5.3.0",
"eslint-config-airbnb": "^18.2.0",
"eslint-plugin-cypress": "^2.2.1",
"eslint-plugin-import": "^2.20.0",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-react": "^7.11.1",
"exports-loader": "^0.7.0",
"file-loader": "^1.1.11",
"html-loader": "^1.3.2",
"html-loader-jest": "^0.2.1",
"http-proxy": "^1.17.0",
"http-server": "^0.11.1",
"image-webpack-loader": "^7.0.1",
"imports-loader": "^0.8.0",
"js-yaml": "^3.13.0",
"postcss": "^7.0.27",
"postcss-cli": "^6.1.3",
"postcss-custom-properties": "^9.1.1",
"postcss-import": "^12.0.1",
"react-test-renderer": "^16.4.2",
"serverless": "^1.50.1",
"serverless-finch": "^2.4.2",
"serverless-offline": "^5.8.0",
"serverless-plugin-common-layers": "^1.0.0",
"serverless-plugin-tracing": "2.0.0",
"string-replace-loader": "^2.2.0",
"svg-url-loader": "^7.1.1",
"terser-webpack-plugin": "^1.2.3",
"uglifyjs-webpack-plugin": "^2.1.2",
"url-loader": "^2.2.0",
"webpack": "^4.29.6",
"webpack-bundle-analyzer": "^3.1.0",
"webpack-cli": "^3.3.0",
"webpack-dev-server": "^3.2.1",
"webpack-manifest-plugin": "^2.0.4",
"webpack-merge": "^4.2.1",
"webpack-node-externals": "^1.7.2"
},
"dependencies": {
"airbnb-browser-shims": "^3.3.0",
"jest": "^25.1.0",
"myRepo": "git+ssh://git#github.com:githUser/myRepo.git#master",
"prop-types": "^15.6.2",
"react": "^16.4.2",
"react-dom": "^16.4.2",
"react-google-recaptcha": "^2.1.0",
"react-hook-form": "^6.15.4",
"react-hook-inview": "^4.3.8",
"react-loadable": "^5.5.0",
"regenerator-runtime": "^0.13.5",
"rollbar": "^2.4.1",
"sanitize-html": "^2.3.2",
"source-map-support": "^0.5.16",
"style-loader": "^1.2.1",
"uuid": "^3.3.3",
"validator": "^13.5.2",
"whatwg-fetch": "^2.0.4",
"xss-filters": "^1.2.7"
}
}
I've updated my Material-UI version to 1.0.0, but I'm having this strange error that
_react.default.memo is not a function
at createSvgIcon
I've done a little research and they say to downgrade the react redux library to 6.0.0, so I've done this but the error persists. The dependencies are these:
"dependencies": {
"#material-ui/codemod": "^4.5.0",
"#material-ui/core": "^1.0.0",
"#material-ui/icons": "^4.5.1",
"#material-ui/styles": "^4.7.1",
"babel-polyfill": "~6.22.0",
"browser-filesaver": "~1.1.1",
"build-url": "~1.2.0",
"es6-promise": "~4.2.5",
"file-saver": "~2.0.1",
"iban": "~0.0.8",
"immutable": "~3.8.2",
"jsdoc": "^3.6.3",
"jsdoc-api": "~3.0.0",
"loaders.css": "~0.1.2",
"material-ui": "^0.20.2",
"moment": "~2.20.1",
"prop-types": "~15.6.0",
"react": "~16.3.0",
"react-datepicker": "~0.48.0",
"react-dom": "~16.2.0",
"react-feature-toggles": "~3.0.3",
"react-intl": "~2.4.0",
"react-loaders": "~3.0.1",
"react-redux": "~6.0.0",
"react-router": "~3.2.0",
"react-tooltip": "~3.10.0",
"redux": "~3.7.2",
"redux-form": "~6.8.0",
"redux-form-material-ui": "~4.3.3",
"redux-immutable": "~4.0.0",
"redux-persist": "~4.8.0",
"redux-persist-immutable": "~4.3.1",
"redux-saga": "~0.15.3",
"whatwg-fetch": "~2.0.1"
},
"devDependencies": {
"babel-core": "~6.26.0",
"babel-eslint": "~7.1.1",
"babel-loader": "~7.1.2",
"babel-plugin-istanbul": "~3.1.2",
"babel-plugin-transform-object-rest-spread": "~6.26.0",
"babel-plugin-transform-runtime": "~6.23.0",
"babel-preset-es2015": "~6.22.0",
"babel-preset-react": "~6.22.0",
"chai": "~3.5.0",
"cross-env": "~6.0.3",
"css-loader": "~0.26.0",
"enzyme": "~3.6.0",
"enzyme-adapter-react-16": "~1.5.0",
"enzyme-react-intl": "~1.4.5",
"enzyme-redux": "~0.1.8",
"eslint": "~3.19.0",
"eslint-config-airbnb": "~14.1.0",
"eslint-loader": "~1.6.1",
"eslint-plugin-import": "~2.2.0",
"eslint-plugin-jsx-a11y": "~4.0.0",
"eslint-plugin-react": "~6.9.0",
"exports-loader": "~0.6.3",
"file-loader": "~0.10.1",
"html-loader": "~0.4.4",
"html-webpack-plugin": "~2.28.0",
"ignore-styles": "~5.0.1",
"imports-loader": "~0.7.0",
"istanbul": "~0.4.5",
"jsdom": "~9.8.3",
"jsdom-global": "~2.1.0",
"json-loader": "~0.5.4",
"mocha": "~5.0.1",
"node-sass": "~4.13.0",
"nyc": "~14.1.1",
"react-test-renderer": "~16.5.2",
"redux-saga-testing": "~1.0.5",
"redux-test-utils": "~0.1.3",
"sass-loader": "~4.1.1",
"sinon": "~2.2.0",
"style-loader": "~0.13.1",
"webpack": "~3.10.0",
"webpack-dev-server": "~2.11.1"
},
Do you know why this error occurs?
In your dependencies, you are using the latest version of #material-ui/icons (v4.5.1). This version uses React.memo in createSvgIcon. React.memo was introduced in React 16.6, but you are using version 16.3 of React.
My recommendation would be to go to the latest version of React (16.12.0 for react and react-dom). This will give you more flexibility in which versions of other libraries you can leverage. At a minimum, you should upgrade React to at least 16.8 since the current versions of many libraries are dependent on React hooks.
when I change any sass file in my project after that my project stopped working and in console return following error:
Uncaught TypeError: (0 , h.default) is not a function
I think it's from the version of node-sass and ...
Can anyone help me?
My package.js is:
{
"dependencies": {
"axios": "^0.18.0",
"history": "^3.3.0",
"react": "16.2.0",
"react-dom": "16.2.0",
"react-helmet": "^5.2.0",
"react-redux": "^5.0.7",
"react-router-dom": "4.2.2",
"react-router-redux": "^4.0.8",
"redux": "^3.7.2",
"redux-thunk": "^2.2.0"
},
"devDependencies": {
"autoprefixer": "^8.2.0",
"autoprefixer-loader": "^3.2.0",
"babel-core": "^6.25.0",
"babel-eslint": "^7.2.3",
"babel-loader": "^7.1.1",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-babili": "^0.1.4",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"compression-webpack-plugin": "^1.0.1",
"copy-webpack-plugin": "^4.5.1",
"cross-env": "^5.1.4",
"css-loader": "^0.28.11",
"extract-text-webpack-plugin": "^3.0.2",
"file-loader": "^0.11.2",
"html-webpack-plugin": "^2.29.0",
"ignore-loader": "^0.1.2",
"image-webpack-loader": "^3.3.1",
"node-sass": "^4.5.3",
"postcss-loader": "^2.1.3",
"redux": "^3.7.2",
"sass-loader": "^6.0.6",
"style-loader": "^0.20.3",
"url-loader": "^0.5.9",
"webpack": "^3.3.0",
"webpack-dev-server": "^2.5.1",
"webpack-visualizer-plugin": "^0.1.11"
}
}
For example, I'm developing my own project package:
/myproject
/package.json
Where the dependencies is empty:
dependencies: {
}
And currently I just want to import all the dependencies from another package, is it possible?
Like if I want to import the dependencies from the belowing git package:
https://github.com/iview/iview-admin
That is, import and merge the below dependencies into the current package, with some command, is it possible?
"dependencies": {
"area-data": "^1.0.0",
"axios": "^0.17.1",
"clipboard": "^1.7.1",
"countup": "^1.8.2",
"cropperjs": "^1.2.2",
"echarts": "^3.8.5",
"html2canvas": "^0.5.0-beta4",
"iview": "^2.8.0",
"iview-area": "^1.5.16",
"js-cookie": "^2.2.0",
"rasterizehtml": "^1.2.4",
"simplemde": "^1.11.2",
"sortablejs": "^1.7.0",
"tinymce": "^4.7.4",
"vue": "^2.5.13",
"vue-router": "^3.0.1",
"vue-virtual-scroller": "^0.10.6",
"vuex": "^3.0.1",
"xlsx": "^0.11.17"
},
"devDependencies": {
"autoprefixer-loader": "^3.2.0",
"babel": "^6.23.0",
"babel-core": "^6.23.1",
"babel-eslint": "^8.2.1",
"babel-loader": "^7.1.2",
"babel-plugin-syntax-dynamic-import": "^6.18.0",
"babel-plugin-transform-runtime": "^6.12.0",
"babel-preset-env": "^1.6.1",
"babel-preset-es2015": "^6.9.0",
"babel-preset-stage-3": "^6.24.1",
"babel-runtime": "^6.11.6",
"clean-webpack-plugin": "^0.1.17",
"copy-webpack-plugin": "^4.3.1",
"css-hot-loader": "^1.3.5",
"css-loader": "^0.28.8",
"ejs-loader": "^0.3.0",
"eslint": "^4.15.0",
"eslint-config-standard": "^10.2.1",
"eslint-plugin-html": "^4.0.1",
"eslint-plugin-import": "^2.8.0",
"eslint-plugin-node": "^5.2.1",
"eslint-plugin-promise": "^3.6.0",
"eslint-plugin-standard": "^3.0.1",
"extract-text-webpack-plugin": "^3.0.2",
"file-loader": "^1.1.6",
"happypack": "^4.0.1",
"html-loader": "^0.5.4",
"html-webpack-plugin": "^2.28.0",
"less": "^2.7.3",
"less-loader": "^4.0.5",
"semver": "^5.4.1",
"style-loader": "^0.19.1",
"unsupported": "^1.1.0",
"url-loader": "^0.6.2",
"vue-hot-reload-api": "^2.2.4",
"vue-html-loader": "^1.2.3",
"vue-i18n": "^5.0.3",
"vue-loader": "^13.7.0",
"vue-style-loader": "^3.0.3",
"vue-template-compiler": "^2.5.13",
"webpack": "^3.10.0",
"webpack-dev-server": "^2.10.1",
"webpack-merge": "^4.1.1",
"webpack-uglify-parallel": "^0.1.4"
}
If your local package.json is empty - you can just c/p dependencies.
Also, if your question is about doing this from time to time, with different projects, you can consider using a npm package that provides such function.
It also will warn you about any potential conflicts of the versions declared.