I am using material UI in my react application and I am having difficulty getting the material-ui-pickers example to work.
Here is the online example from Material UI.
https://codesandbox.io/s/52p74362pl
The error that i am getting is:
index.js:1446 ../node_modules/#date-io/date-fns/build/index.esm.js Module not found: `Can't resolve 'date-fns/addDays' in 'C:\Project4\CDE\IFS.CDE.Web\node_modules\#date-io\date-fns\build'`
here are my package.json files
{
"name": "IFS.CDE.Web",
"version": "0.1.0",
"private": true,
"dependencies": {
"#material-ui/core": "^3.7.1",
"#material-ui/icons": "^3.0.1",
"ajv": "^6.5.2",
"autosuggest-highlight": "^3.1.1",
"axios": "^0.18.0",
"classnames": "^2.2.5",
"connected-react-router": "6.1.0",
"date-fns": "^1.30.1",
"downshift": "^2.0.10",
"extract-svg-path": "^2.1.0",
"file-saver": "^1.3.8",
"install": "^0.12.1",
"lodash": "^4.17.10",
"material-ui-datetimepicker": "^1.0.7",
"material-ui-image": "^3.0.3",
"material-ui-pickers": "^2.1.1",
"moment": "^2.23.0",
"npm": "^6.5.0",
"parse-svg-path": "^0.1.2",
"prop-types": "^15.6.2",
"rc-progress": "^2.2.6",
"react": "^16.6.3",
"react-autosuggest": "^9.3.4",
"react-bingmaps": "^3.6.1",
"react-color": "^2.14.1",
"react-dnd": "^7.0.2",
"react-dom": "^16.6.3",
"react-dropzone": "^4.3.0",
"react-file-viewer": "^0.5.0",
"react-iframe": "^1.2.0",
"react-loadable": "^5.5.0",
"react-popper": "^0.10.1",
"react-redux": "^6.0.0",
"react-render-html": "^0.6.0",
"react-router-dom": "^4.3.1",
"react-scripts": "^2.1.2",
"react-select": "^2.0.0",
"redux": "^4.0.1",
"redux-persist": "^5.10.0",
"redux-thunk": "^2.3.0",
"rimraf": "^2.6.2",
"typeface-roboto": "^0.0.54",
"uuid": "^3.3.2",
"video-react": "^0.13.1"
},
"scripts": {
"start": "rimraf ./build && react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"set-env": "set NODE_ENV=production"
},
"devDependencies": {},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
}
I have installed date-fns but i still get the error.
https://www.npmjs.com/package/date-fns.
I also deleted all the node module and did a npm install to see if that would solve the issue but it did not.
Thanks for the help.
install this(see here):
npm i --save date-fns#next #date-io/date-fns
Try using date-fns 2.0.0. I had the same issue and fixed by updating the lib. Hope it works.
Related
I'm trying to integrate with the coinbase pay sdk. I've created a button using their examples, however when trying to build I'm getting an issue Internal to their SDK
When trying to build my code I get an error internal to the `#coinbase/cbpay-js sdk
./node_modules/#coinbase/cbpay-js/dist/index.mjs 135:34 Module parse
failed: Unexpected token (135:34) File was processed with these
loaders: * ./node_modules/babel-loader/lib/index.js You may need an
additional loader to handle the result of these loaders. | var
isMobileSdkTarget = /* #PURE */__name(win => { | try {
return win.ReactNativeWebView?.postMessage !== void 0; | } catch { | return false;
This is my package.json:
{
"name": "React App",
"version": "0.1.0",
"private": true,
"devDependencies": {
"#arkane-network/web3-arkane-provider": "^0.23.0",
"#ethersproject/experimental": "^5.4.0",
"#gelatonetwork/limit-orders-react": "^2.4.0",
"#gnosis.pm/safe-apps-sdk": "^4.0.0",
"#reduxjs/toolkit": "^1.3.5",
"#transak/transak-sdk": "^1.0.28",
"#types/jest": "^25.2.1",
"#types/lodash.flatmap": "^4.5.6",
"#types/multicodec": "^1.0.0",
"#types/node": "^13.13.5",
"#types/qs": "^6.9.2",
"#types/react": "^17.0.0",
"#types/react-dom": "^17.0.0",
"#types/react-redux": "^7.1.8",
"#types/react-router-dom": "^5.1.8",
"#types/react-slick": "^0.23.7",
"#types/react-virtualized-auto-sizer": "^1.0.1",
"#types/react-window": "^1.8.5",
"#types/styled-components": "^5.1.15",
"#types/testing-library__cypress": "^5.0.5",
"#typescript-eslint/eslint-plugin": "^5.3.1",
"#typescript-eslint/parser": "^5.3.1",
"#uniswap/governance": "^1.0.2",
"#uniswap/liquidity-staker": "^1.0.2",
"#uniswap/merkle-distributor": "1.0.1",
"#uniswap/sdk": "npm:quickswap-sdk#3.0.8",
"#uniswap/token-lists": "npm:quickswap-token-lists#1.0.1",
"#uniswap/v2-core": "1.0.0",
"#uniswap/v2-periphery": "^1.1.0-beta.0",
"#web3-react/core": "6.0.9",
"#web3-react/injected-connector": "6.0.7",
"#web3-react/ledger-connector": "6.1.9",
"#web3-react/portis-connector": "6.0.9",
"#web3-react/walletconnect-connector": "6.2.4",
"#web3-react/walletlink-connector": "6.2.3",
"ajv": "^6.12.3",
"apollo-cache-inmemory": "^1.6.6",
"apollo-client": "^2.6.10",
"apollo-link-http": "^1.5.17",
"cids": "^1.1.9",
"copy-to-clipboard": "^3.2.0",
"cypress": "^7.7.0",
"eslint": "^7.11.0",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-prettier": "^3.1.3",
"eslint-plugin-react": "^7.19.0",
"eslint-plugin-react-hooks": "^4.0.0",
"ethers": "^5.0.7",
"fortmatic": "^2.2.1",
"graphql": "^15.5.1",
"graphql-tag": "^2.12.5",
"hamburger-react": "^2.4.1",
"i18next": "^20.4.0",
"i18next-browser-languagedetector": "^6.1.2",
"ipfs-deploy": "^11.1.0",
"lodash.flatmap": "^4.5.0",
"multicodec": "^3.0.1",
"multihashes": "^3.0.1",
"polished": "^3.3.2",
"prettier": "^1.17.0",
"qs": "^6.9.4",
"react": "^17.0.2",
"react-app-rewired": "^2.1.8",
"react-device-detect": "^1.6.2",
"react-dom": "^17.0.2",
"react-feather": "^2.0.8",
"react-i18next": "^11.11.4",
"react-redux": "^7.2.4",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.3",
"react-virtualized-auto-sizer": "^1.0.6",
"react-window": "^1.8.6",
"redux-localstorage-simple": "^2.4.1",
"serve": "^11.3.2",
"source-map-explorer": "^2.5.2",
"start-server-and-test": "^1.11.0",
"typescript": "^4.1.2",
"web3": "^1.7.0"
},
"resolutions": {
"yargs-parser": "^13.1.2",
"underscore": "^1.12.1",
"lodash": "^4.17.21",
"trim-newlines": "^3.0.1",
"nth-check": "^2.0.1",
"node-fetch": "^2.6.7",
"follow-redirects": "^1.14.8",
"axios": "^0.21.2",
"immer": "^9.0.6",
"ansi-html": "^0.0.8",
"node-forge": "^1.3.0",
"glob-parent": "^5.1.2",
"browserslist": "^4.16.5",
"ajv": "^6.12.3",
"async": "^3.2.2",
"ejs": "^3.1.7",
"cross-fetch": "^3.1.5",
"eventsource": "^2.0.2",
"protobufjs": "^6.11.3",
"shell-quote": "^1.7.3",
"terser": "^4.8.1",
"got": "^11.8.5",
"jpeg-js": "^0.4.4"
},
"scripts": {
"analyze": "source-map-explorer 'build/static/js/*.js'",
"start": "react-app-rewired start",
"build": "CI=false react-app-rewired --max_old_space_size=4096 build",
"test": "react-app-rewired test --env=jsdom",
"format": "prettier --write \"**/*.{ts,js,tsx,json,md}\"",
"eject": "react-scripts eject",
"integration-test": "start-server-and-test 'serve build -l 3000' http://localhost:3000 'cypress run'",
"ipfs-deploy": "ipfs-deploy build"
},
"eslintConfig": {
"extends": "react-app",
"ignorePatterns": [
"node_modules"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"license": "GPL-3.0-or-later",
"dependencies": {
"#coinbase/cbpay-js": "^1.6.0",
"#material-ui/core": "^4.12.3",
"#material-ui/icons": "^4.11.2",
"#material-ui/lab": "^4.0.0-alpha.60",
"apexcharts": "3.32.1",
"i18next-http-backend": "^1.4.1",
"market-sdk": "^2.2.0",
"react-apexcharts": "1.3.9",
"react-cool-inview": "^2.0.8",
"react-ga": "^3.3.0",
"react-query": "^3.34.19",
"react-reflex": "^4.0.6",
"react-slick": "^0.28.1",
"react-virtuoso": "^2.8.4",
"sass": "^1.51.0",
"slick-carousel": "^1.8.1",
"styled-components": "^5.3.3"
}
}
Edit: Configuration Overrides:
const {paths} = require('react-app-rewired');
// load environment variables from .env files
// before overrides scripts are read
require(paths.scriptVersion + '/config/env');
const override = require(paths.configOverrides);
const webpack = typeof override === 'function'
? override
: override.webpack || ((config, env) => config);
if (override.devserver) {
console.log(
'Warning: `devserver` has been deprecated. Please use `devServer` instead as ' +
'`devserver` will not be used in the next major release.'
)
}
const devServer = override.devServer || override.devserver
|| ((configFunction) =>
(proxy, allowedHost) =>
configFunction(proxy, allowedHost));
const jest = override.jest || ((config) => config);
const pathsOverride = override.paths || ((paths, env) => paths);
// normalized overrides functions
module.exports = {
webpack,
devServer,
jest,
paths: pathsOverride
};
I'm guessing I'm missing a dependecy for a babel loader or something, but I'm not sure how to figure out which one I need?
package.json
{
"name": "reactjs",
"version": "4.7.1",
"private": true,
"dependencies": {
"#ant-design/icons": "^4.2.2",
"#aspnet/signalr": "^1.1.4",
"#craco/craco": "^5.6.2",
"#fullcalendar/bootstrap": "^5.9.0",
"#fullcalendar/core": "4.4.0",
"#fullcalendar/daygrid": "^5.9.0",
"#fullcalendar/interaction": "^5.9.0",
"#fullcalendar/react": "^5.9.0",
"#fullcalendar/timegrid": "4.4.2",
"#types/d3-scale": "^4.0.2",
"#types/react-bootstrap-table-next": "^4.0.18",
"abp-web-resources": "^5.1.1",
"antd": "^4.6.4",
"apexcharts": "^3.35.2",
"axios": "^0.19.0",
"bootstrap": "^5.1.0",
"classnames": "^2.2.6",
"craco-antd": "^1.14.1",
"d3-scale": "^4.0.2",
"echarts": "^5.3.2",
"echarts-for-react": "^3.0.2",
"env-cmd": "^10.1.0",
"famfamfam-flags": "^1.0.0",
"formik": "^2.2.9",
"highcharts": "^10.2.0",
"highcharts-react-official": "^3.1.0",
"lodash": "^4.17.15",
"mobx": "^6.5.0",
"mobx-react": "^7.4.0",
"mobx-react-lite": "^3.4.0",
"moment": "^2.24.0",
"moment-timezone": "^0.5.27",
"query-string": "^6.9.0",
"rc-slider": "^8.7.1",
"rc-tooltip": "^4.0.0-alpha.3",
"react": "^18.1.0",
"react-apexcharts": "^1.4.0",
"react-bootstrap": "^2.0.0-beta.6",
"react-bootstrap-table-next": "^3.3.5",
"react-bootstrap-table2-editor": "^1.4.0",
"react-bootstrap-table2-paginator": "^2.1.1",
"react-bootstrap-table2-toolkit": "^2.1.1",
"react-datepicker": "^2.11.0",
"react-datetime": "^2.16.3",
"react-document-title": "^2.0.3",
"react-dom": "^18.1.0",
"react-image-crop": "^9.0.3",
"react-loadable": "^5.5.0",
"react-notifications": "^1.4.3",
"react-perfect-scrollbar": "^1.5.3",
"react-quill": "^1.3.3",
"react-router-dom": "^5.1.2",
"react-scripts": "^3.2.0",
"react-select": "^5.3.2",
"react-vis": "^1.11.7",
"recharts": "^1.8.5",
"sass": "^1.51.0",
"sweetalert2": "^9.5.4",
"sweetalert2-react": "^0.8.3",
"yup": "^0.32.11"
},
"eslintConfig": {
"extends": "react-app"
},
"scripts": {
"start": "env-cmd -f .env.dev craco start",
"start-local": "env-cmd -f .env.local craco start",
"start-production": "env-cmd -f .env.production craco start",
"build": "env-cmd -f .env.dev craco build",
"build-local": "env-cmd -f .env.local craco build",
"build-production": "env-cmd -f .env.production craco build",
"lint": "eslint . --ext .ts,.tsx",
"test": "craco test",
"eject": "react-scripts eject"
},
"devDependencies": {
"#types/classnames": "^2.2.9",
"#types/jest": "^24.0.23",
"#types/moment": "^2.13.0",
"#types/moment-timezone": "^0.5.12",
"#types/node": "^12.12.14",
"#types/react": "^16.9.13",
"#types/react-datepicker": "^4.4.1",
"#types/react-document-title": "^2.0.3",
"#types/react-dom": "^16.9.4",
"#types/react-loadable": "^5.5.2",
"#types/react-router-dom": "^5.1.3",
"#types/react-vis": "^1.11.11",
"#types/recharts": "^1.8.3",
"#typescript-eslint/eslint-plugin": "^4.0.1",
"#typescript-eslint/parser": "^4.0.1",
"copy-webpack-plugin": "^5.0.5",
"eslint": "^6.8.0",
"eslint-config-airbnb-typescript": "^9.0.0",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-import": "^2.22.0",
"eslint-plugin-jest": "^23.17.1",
"eslint-plugin-jsx-a11y": "^6.3.1",
"eslint-plugin-prettier": "^3.1.4",
"eslint-plugin-react": "^7.20.6",
"eslint-plugin-react-hooks": "^4.1.0",
"prettier": "^2.0.5",
"ts-import-plugin": "^1.6.1",
"typescript": "^3.7.2"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"resolutions": {
"#types/react": "16.3.0"
}
}
What I've done:
yarn - install correctly but finally I had:
screenshot
npm ci
npm i
npm i --force and npm i --legacy-peer-deps(both install modules, but finally I had an error)
tried to add resolutions to package.json
deleted package-lock, yarn.lock and node_modules and after npm i or yarn
tried different versions of react in resolution package
Node version: tried with 14.15 and then updated to 16.17
NPM: 8.11.0
with resolutions like I have in package.json:
screenshot
without resolutions:
screenshot
Got a archive with all fronted files(with node modules) and tried to start(failed), but on other windows machine project started correctly(Node 14.15, npm version 6)
U.P.D new error: screenshot
U.P.D 2: maybe it makes more sense to resolve the issues from the first screen shot?
If you want to resolve your dependencies you will have to change the used versions. your package.json requires "react": "^18.1.0", while react-bootstrap-table-next requires "react": "^16.3.0",.
If you want to resolve your conflict you will have to update react-bootstrap-table-next to a version which supports "react": "^18.1.0", or downgrade your react dependency in the package.json to "react": "^16.3.0",
I am trying to refactor my old shopify project but, when I run command, "shopify node serve" It gives me the following error.
"This command can only be run within node projects."
But, It is a node project. It is a next.js shopify application.
Below is my package.json file.
{
"name": "Announcement_Bar",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "forever start --minUptime 1000 server.js",
"build": "next build",
"start": "NODE_ENV=production forever start --minUptime 1000 server.js"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"#fortawesome/fontawesome-svg-core": "^1.2.34",
"#fortawesome/free-brands-svg-icons": "^5.15.2",
"#fortawesome/free-regular-svg-icons": "^5.15.2",
"#fortawesome/free-solid-svg-icons": "^5.15.2",
"#fortawesome/react-fontawesome": "^0.1.14",
"#koa/cors": "^3.1.0",
"#material-ui/core": "^4.11.3",
"#material-ui/icons": "^4.11.2",
"#maxmind/geoip2-node": "^1.6.0",
"#shopify/app-bridge": "^1.28.0",
"#shopify/app-bridge-react": "^1.28.0",
"#shopify/app-bridge-utils": "^1.28.0",
"#shopify/koa-shopify-auth": "^3.2.0",
"#shopify/koa-shopify-graphql-proxy": "^3.3.1",
"#shopify/koa-shopify-webhooks": "^2.6.0",
"#shopify/polaris": "^4.27.0",
"#zeit/next-css": "^1.0.1",
"#zeit/next-sass": "^1.0.1",
"ag-grid-community": "^22.1.1",
"ag-grid-react": "^22.1.1",
"agile_crm": "^1.2.5",
"animate.css": "^3.7.2",
"animate.css-react": "1.0.0",
"apollo-boost": "^0.4.9",
"bitly": "^7.1.2",
"currency-formatter": "^1.5.6",
"dotenv": "^8.2.0",
"draft-js": "^0.11.7",
"draftjs-to-html": "^0.9.1",
"emoji-picker-react": "^3.4.2",
"es6-promise": "^4.2.8",
"fbjs": "^3.0.0",
"graphql": "^14.7.0",
"he": "^1.2.0",
"html-to-draftjs": "^1.5.0",
"install": "^0.13.0",
"isomorphic-fetch": "^2.2.1",
"javascript-obfuscator": "^0.24.6",
"js-cookie": "^2.2.1",
"jsonwebtoken": "^8.5.1",
"koa": "^2.13.1",
"koa-body": "^4.2.0",
"koa-bodyparser": "^4.3.0",
"koa-cache-control": "^2.0.0",
"koa-conditional-get": "^2.0.0",
"koa-etag": "^3.0.0",
"koa-mongo": "^1.9.3",
"koa-router": "^7.4.0",
"koa-session": "^5.13.1",
"koa-shopify-auth-cookieless": "^1.0.31",
"koa-shopify-graphql-proxy-cookieless": "^1.0.11",
"koa-static": "^5.0.0",
"koa-static-cache": "^5.1.4",
"koa2-formidable": "^1.0.2",
"lodash": "^4.17.20",
"mailchimp-api-v3": "^1.14.0",
"mmmagic": "^0.5.3",
"moment": "^2.29.1",
"mongodb": "^3.6.4",
"ms": "^2.1.3",
"next": "^9.5.5",
"node-cron": "^2.0.3",
"node-sass": "^4.14.1",
"nodemailer": "^6.4.17",
"notistack": "^0.9.17",
"npm": "^7.5.2",
"parse-link-header": "^1.0.1",
"react": "^16.14.0",
"react-apollo": "^3.1.5",
"react-color": "^2.19.3",
"react-copy-to-clipboard": "^5.0.3",
"react-datepicker": "^2.16.0",
"react-dom": "^16.14.0",
"react-draft-wysiwyg": "^1.14.5",
"react-hotjar": "^2.2.1",
"react-loading-overlay": "^1.0.1",
"react-measure": "^2.5.2",
"react-player": "^1.15.3",
"react-select": "^3.2.0",
"react-select-country-list": "^2.2.3",
"react-slick": "^0.27.14",
"react-world-flags": "^1.4.0",
"shopify-jwt-auth-verify": "^1.0.10",
"store-js": "^2.0.4"
},
"devDependencies": {}
}
My node version is: 14.6.0
Shopify version: 2.6.5
I am not sure what is the problem, Only shopify node commands related to starting the server, are not working. All other shopify commands are working.
I have upgraded the existing react native project from react native 0.59.6 to 0.61.5.
react-native upgrade command not working. So I have done the manual upgrade using upgrade helper. Resolved some post issues. Now project build success.
But After rendering into the ios emulator from Xcode, it is giving the following error.
I am not using Component.propTypes anywhere. package.lock.json have some packages with prop-types. I am not sure what it is doing exactly. Otherwise, inside my project, I am not using
prop-types also. Please find my package.lock.json below,
package.lock.json
...
...
...
"prop-types": {
"version": "15.7.2",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz",
"integrity": "sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==",
"requires": {
"loose-envify": "^1.4.0",
"object-assign": "^4.1.1",
"react-is": "^16.8.1"
}
},
....
"react": {
"version": "16.9.0",
"resolved": "https://registry.npmjs.org/react/-/react-16.9.0.tgz",
"integrity": "sha512-+7LQnFBwkiw+BobzOF6N//BdoNw0ouwmSJTEm9cglOOmsg/TMiFHZLe2sEoN5M7LgJTj9oHH0gxklfnQe66S1w==",
"requires": {
"loose-envify": "^1.1.0",
"object-assign": "^4.1.1",
"prop-types": "^15.6.2"
}
},
....
package.json
{
"name": "wasfat",
"version": "1.0.3",
"private": true,
"rnpm": {
"assets": [
"app/assets/fonts/corbel"
]
},
"scripts": {
"prepare-repository": "npm i -g react-native-cli yarn;yarn install; react- native link",
"emulator": "emulator -avd Nexus5V6L23_x86_64 -scale 1.0",
"clean": "watchman watch-del-all && npm cache clean && cd android && ./gradlew clean && cd ..",
"test": "jest",
"postinstall": "rm -rf node_modules/react-native-twitter-signin/node_modules",
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"lint": "eslint ."
},
"dependencies": {
"jetifier": "^1.6.5",
"react": "16.9.0",
"react-native": "^0.61.5",
"react-native-actionsheet": "^2.4.2",
"react-native-android-keyboard-adjust": "^1.2.0",
"react-native-aws3": "0.0.8",
"react-native-deep-linking": "^2.2.0",
"react-native-device-info": "^5.3.1",
"react-native-double-tap": "^1.0.1",
"react-native-drawer": "^2.5.1",
"react-native-elements": "^1.0.0",
"react-native-exception-handler": "^2.10.8",
"react-native-fbsdk": "^1.1.0",
"react-native-firebase": "^5.5.6",
"react-native-gesture-handler": "^1.1.0",
"react-native-google-signin": "^1.2.3",
"react-native-hide-with-keyboard": "^1.2.0",
"react-native-image-crop-picker": "^0.25.3",
"react-native-image-picker": "^0.28.1",
"react-native-image-slider": "^2.0.3",
"react-native-image-view": "^2.1.5",
"react-native-keyboard-avoiding-view": "^1.0.0",
"react-native-keyboard-aware-scroll-view": "^0.8.0",
"react-native-keyboard-aware-scrollview": "^2.0.0",
"react-native-keyboard-aware-view": "0.0.14",
"react-native-keyboard-listener": "^1.1.0",
"react-native-modal": "^11.1.0",
"react-native-paper": "^2.15.0",
"react-native-picker-select": "^6.2.0",
"react-native-popup-menu": "^0.15.6",
"react-native-progress": "^3.6.0",
"react-native-read-more-text": "^1.1.0",
"react-native-responsive-image": "^2.3.1",
"react-native-responsive-screen": "^1.2.1",
"react-native-s3-upload": "0.0.12",
"react-native-share": "^1.2.1",
"react-native-side-drawer": "^1.1.9",
"react-native-side-menu": "^1.1.3",
"react-native-simple-toast": "0.0.8",
"react-native-snap-carousel": "^3.8.0",
"react-native-swiper-flatlist": "^1.0.10",
"react-native-twitter-signin": "^1.1.1",
"react-native-vector-icons": "^6.6.0",
"react-native-video": "^4.4.4",
"react-native-video-controls": "^2.2.3",
"react-native-video-player": "^0.10.0",
"react-native-view-more-text": "^2.1.0",
"react-navigation": "^3.3.0",
"react-redux": "^7.1.0",
"react-spinkit": "^3.0.0",
"redux": "^4.0.4"
},
"devDependencies": {
"#babel/core": "^7.6.2",
"#babel/runtime": "^7.6.2",
"#react-native-community/eslint-config": "^0.0.5",
"babel-jest": "^24.9.0",
"eslint": "^6.5.1",
"jest": "^24.9.0",
"metro-react-native-babel-preset": "^0.56.0",
"react-test-renderer": "16.9.0"
},
"jest": {
"preset": "react-native"
}
}
I have found this https://reactjs.org/warnings/dont-call-proptypes.html regarding this issue. But I am not sure how to use it. Because according to this. some third party libraries using propTypes directly. But how to handle it?
There is no help in 0.61 version Github issues. Please suggest some workarounds for this issue.
Thanks for any help.
I am building react native app and it run successfully on both Android and iOS.
I want to convert react-native app to web app. I try followed tutorial: https://medium.com/#jonnykalambay/your-first-hybrid-app-in-15-minutes-react-native-on-the-web-2cc2646051e
as well as some source (https://react-native-training.github.io/react-native-elements/blog/2018/12/13/react-native-web.html).
But when I run on web, there is error:
Attempted import error: 'ApiGet' is not exported from './apiFetcher'.
My code:
//apiGet.js
function ApiGet(){
//some code
}
module.exports = {ApiGet}
//another file import
import {ApiGet} from './apiGet.js';
I tried an example for testing with this syntax import, export. It run successfully.
My code use both ES5 and ES6. When I run code in react-native, it's OK. I create a demo react-native-web using ES5, it's also OK.
my package.json:
{
"name": "App",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest",
"lint": "eslint .;exit 0",
"start-web": "react-scripts start",
"build-web": "react-scripts build"
},
"jest": {
"preset": "react-native",
"setupFiles": [
"./jest/setup.js"
],
"collectCoverage": true,
"unmockedModulePathPatterns": [
"react"
]
},
"dependencies": {
"async": "^2.5.0",
"babel-loader": "^8.0.5",
"babel-plugin-module-resolver": "^3.1.1",
"babel-preset-react-app": "^6.1.0",
"bugsnag-react-native": "^2.2.0",
"he": "^1.1.1",
"metro-react-native-babel-preset": "^0.51.0",
"moment": "^2.18.1",
"oauth-1.0a": "^2.1.0",
"prop-types": "^15.5.10",
"react": "16.0.0-alpha.12",
"react-app-polyfill": "^0.1.3",
"react-art": "^16.8.6",
"react-dom": "^16.8.6",
"react-native": "^0.59.6",
"react-native-camera": "^0.13.0",
"react-native-datepicker": "^1.4.7",
"react-native-device-info": "^0.11.0",
"react-native-drawer": "^2.3.0",
"react-native-dropdown-menu": "^2.0.0",
"react-native-fast-image": "^1.0.0",
"react-native-fbsdk": "^0.6.1",
"react-native-firebase": "1.1.2",
"react-native-image-progress": "^1.0.1",
"react-native-keyboard-aware-scroll-view": "^0.2.7",
"react-native-modal-dropdown": "^0.4.2",
"react-native-navbar": "^1.5.0",
"react-native-progress": "^3.4.0",
"react-native-push-notification": "^2.2.1",
"react-native-qrcode": "^0.2.7",
"react-native-root-toast": "^1.0.3",
"react-native-router-flux": "^3.37.0",
"react-native-scrollable-tab-view": "^0.8.0",
"react-native-swiper": "^1.5.12",
"react-native-vector-icons": "^4.0.0",
"react-native-web": "^0.11.2",
"react-native-webview-android": "^1.1.17",
"react-navigation": "^1.0.0-beta.11",
"react-redux": "^5.0.3",
"react-router-dom": "^5.0.0",
"react-router-native": "^5.0.0",
"react-scripts": "^3.0.0",
"redux": "^3.7.2",
"redux-logger": "^2.6.1",
"redux-persist": "^4.9.1",
"redux-thunk": "^2.1.0",
"smartech-react-native": "^1.1.1"
},
"devDependencies": {
"babel-core": "^6.23.1",
"babel-eslint": "^10.0.1",
"babel-jest": "^24.7.1",
"babel-polyfill": "^6.23.0",
"babel-preset-react-native": "^1.9.0",
"babel-preset-stage-1": "^6.24.1",
"eslint": "^5.16.0",
"eslint-plugin-react": "^6.8.0",
"jest": "^24.7.1",
"jest-react-native": "^18.0.0",
"react-native-mock": "^0.3.1",
"react-test-renderer": "^15.3.2",
"redux-mock-store": "^1.2.1"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
Please help me. Thanks for advance.
Export APIGet method by using export keyword of ES6 https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export