NextJS on GAE - Error: EROFS: read-only file system - javascript

I'm trying to deploy a Next application with custom server.js into GAE. I can run the project with no problems on local and even on the google GCP CLI. The problem right now is after the app is deployed to GAE successfully via gcloud app deploy, I'm getting the following error when opening the app.
2020-03-30 21:41:21.748 HKT
Error: EROFS: read-only file system, unlink '/srv/dist/functions/next/BUILD_ID'
Expand all | Collapse all{
insertId: "5e81f701000b6ba4e770be02"
labels: {…}
logName: "projects/next-gae/logs/stderr"
receiveTimestamp: "2020-03-30T13:41:21.749839891Z"
resource: {…}
textPayload: "Error: EROFS: read-only file system, unlink '/srv/dist/functions/next/BUILD_ID'"
timestamp: "2020-03-30T13:41:21.748452Z"
}
My app.yaml is below:
runtime: nodejs10
.gcloudignore
# This file specifies files that are *not* uploaded to Google Cloud Platform
# using gcloud. It follows the same syntax as .gitignore, with the addition of
# "#!include" directives (which insert the entries of the given .gitignore-style
# file at that point).
#
# For more information, run:
# $ gcloud topic gcloudignore
#
.gcloudignore
# If you would like to upload your .git directory, .gitignore file or files
# from your .gitignore file, remove the corresponding line
# below:
.git
.gitignore
# Node.js dependencies:
node_modules/
*.hot-update.js*
# Other config and Files
README.md
.eslintignore
.eslintrc
package.json
{
"name": "next-gae",
"version": "0.1.0",
"private": true,
"dependencies": {
"#babel/cli": "^7.8.4",
"#babel/core": "^7.8.3",
"#babel/runtime": "^7.8.7",
"#sentry/browser": "^5.15.0",
"#sentry/integrations": "^5.15.0",
"#sentry/node": "^5.15.0",
"#storybook/addon-actions": "^5.2.6",
"#storybook/addon-info": "^5.2.6",
"#storybook/addon-knobs": "^5.2.6",
"#storybook/addon-links": "^5.2.6",
"#storybook/addon-notes": "^5.2.6",
"#storybook/addon-storysource": "^5.2.6",
"#storybook/addon-viewport": "^5.2.6",
"#storybook/react": "^5.2.6",
"antd": "^3.26.7",
"axios": "^0.19.0",
"connected-react-router": "^6.5.2",
"cookie-parser": "^1.4.4",
"cors": "^2.8.5",
"date-fns": "^2.9.0",
"dotenv": "^8.2.0",
"express": "^4.17.1",
"firebase": "^7.8.0",
"firebase-admin": "^8.10.0",
"firebase-functions": "^3.3.0",
"formik": "^2.1.4",
"helmet": "^3.21.2",
"hpp": "^0.2.3",
"imagemin-optipng": "^7.1.0",
"imagemin-svgo": "^7.1.0",
"immutable": "^4.0.0-rc.12",
"isomorphic-fetch": "^2.2.1",
"js-cookie": "^2.2.1",
"morgan": "^1.9.1",
"next": "^9.1.7",
"next-antd-aza-less": "^1.0.2",
"next-optimized-images": "^2.5.5",
"next-redux-wrapper": "^4.0.1",
"nocache": "^2.1.0",
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-redux": "^7.1.3",
"react-router": "^5.1.2",
"react-smooth-scrollbar": "^8.0.6",
"react-stripe-elements": "^6.0.1",
"react-virtualized": "^9.21.2",
"redux": "^4.0.4",
"redux-devtools": "^3.5.0",
"redux-devtools-extension": "^2.13.8",
"redux-logger": "^3.0.6",
"redux-multi": "^0.1.12",
"redux-observable": "^1.2.0",
"redux-persist": "^6.0.0",
"rxjs": "^6.5.3",
"rxjs-compat": "^6.5.3",
"smooth-scrollbar": "^8.5.1",
"storybook-addon-figma": "^0.1.0",
"storybook-readme": "^5.0.8",
"styled-components": "^5.0.0",
"xss-clean": "^0.1.1",
"yup": "^0.28.2"
},
"engines": {
"node": "10"
},
"scripts": {
"test": "jest",
"flow": "flow",
"eslint": "eslint \"./**/*.{jsx,js}\"",
"lint": "eslint ./src/",
"lint:fix": "npm run lint --fix",
"lint:dry": "npm run lint --fix-dry-run",
"build-next": "next build \"src/app/\"",
"clean": "rimraf dist",
"predeploy": "npm run build-all",
"start": "cd \"src/app/\" ; NODE_ENV=production node server.js",
"deploy:gae": "npm run pre-start; npm run build-next; gcloud app deploy",
"fmt": "prettier --config .prettierrc.yml --write \"{!(node_modules),!(__mock__)/**/}*.{jsx,js,json,md,ts}\""
},
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"*.{jsx,js}": [
"flow focus-check",
"npm run lint:fix",
"git add"
],
"*.{jsx,js,json,md,ts}": [
"npm run fmt",
"git add"
]
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"babel-eslint": "^10.0.3",
"babel-plugin-import": "^1.13.0",
"babel-plugin-inline-import": "^3.0.0",
"babel-plugin-inline-react-svg": "^1.1.1",
"babel-plugin-styled-components": "^1.10.6",
"babel-plugin-transform-flow-strip-types": "^6.22.0",
"cpx": "^1.5.0",
"cross-env": "^7.0.2",
"eslint": "^6.6.0",
"eslint-config-airbnb": "^18.0.1",
"eslint-config-airbnb-base": "^14.0.0",
"eslint-config-prettier": "^6.5.0",
"eslint-plugin-flowtype": "^4.4.1",
"eslint-plugin-import": "^2.14.0",
"eslint-plugin-jsx-a11y": "^6.1.2",
"eslint-plugin-prettier": "^3.1.1",
"eslint-plugin-react": "^7.16.0",
"firebase-functions-test": "^0.2.0",
"firebase-tools": "^7.15.1",
"flow-bin": "^0.111.3",
"husky": "^3.1.0",
"jest": "^24.8.0",
"lint-staged": "^9.4.2",
"nodemon": "^2.0.2",
"prettier": "^1.19.1",
"rimraf": "^3.0.2",
"webpack": "^4.42.0"
}
}

The error you are getting is telling you that the path you are trying to delete from is read only. In GAE standard the paths you can write to are limited:
Java 8, Java 11, Node.js, Python 3.7, PHP 7.2, PHP 7.3, Ruby 2.5
(beta), Go 1.11, Go 1.12, and Go 1.13 have read and write access to
the /tmp directory.
You should handle your files in the /tmp directory or use App Engine Flex if you cannot do so.

Related

How to resolve dependencies npm conflict?

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",

BABEL_PARSE_ERROR when importing App.Js into node

So i have been trying to get my ejected create-react-app, switched to be server side rendered. This is a simplified version of my file structure:
...
/client
/build
/public
package.json
/src
index.js
/components
/app
App.js
/routes
/api
Canvas.js
.babelrc
server.js
package.json
...
I am trying to import App.js into Canvas.Js, So that i can use it in a ReactDOMServer.renderToString();
The problem though, is on the actual import. The import brings up this error:
client/src/components/app/App.js: Unexpected token (34:4)
32 |
33 | return (
> 34 | <div>
| ^
35 | <IconSettings
at Parser.raise (/Users/braydenparkinson/dev/workingAppopsCopy/appops-app/node_modules/#babel/parser/src/parser/location.js:41:63)
at Parser.unexpected (/Users/braydenparkinson/dev/workingAppopsCopy/appops-app/node_modules/#babel/parser/src/parser/util.js:150:16)
at Parser.parseExprAtom (/Users/braydenparkinson/dev/workingAppopsCopy/appops-app/node_modules/#babel/parser/src/parser/expression.js:1116:20)
at Parser.parseExprSubscripts (/Users/braydenparkinson/dev/workingAppopsCopy/appops-app/node_modules/#babel/parser/src/parser/expression.js:526:23)
at Parser.parseMaybeUnary (/Users/braydenparkinson/dev/workingAppopsCopy/appops-app/node_modules/#babel/parser/src/parser/expression.js:506:21)
at Parser.parseExprOps (/Users/braydenparkinson/dev/workingAppopsCopy/appops-app/node_modules/#babel/parser/src/parser/expression.js:295:23)
at Parser.parseMaybeConditional (/Users/braydenparkinson/dev/workingAppopsCopy/appops-app/node_modules/#babel/parser/src/parser/expression.js:247:23)
at Parser.parseMaybeAssign (/Users/braydenparkinson/dev/workingAppopsCopy/appops-app/node_modules/#babel/parser/src/parser/expression.js:195:21)
at Parser.parseParenAndDistinguishExpression (/Users/braydenparkinson/dev/workingAppopsCopy/appops-app/node_modules/#babel/parser/src/parser/expression.js:1293:16)
at Parser.parseExprAtom (/Users/braydenparkinson/dev/workingAppopsCopy/appops-app/node_modules/#babel/parser/src/parser/expression.js:1023:21) {
pos: 1681,
loc: Position { line: 34, column: 4 },
code: 'BABEL_PARSE_ERROR'
}
I am just pulling it in with:
const App = require('../../client/src/components/app/App');
And i have used both require and import, with the same result. Not that, that should change anything but in case anyone asks.
Here is my babelrc:
{
"presets": ["#babel/preset-env", "#babel/preset-react"],
"plugins": ["#babel/plugin-transform-react-jsx"]
}
Heres my package.json:
{
"name": "express-canvas-app",
"version": "1.0.0",
"description": "",
"main": "server.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "babel-node server.js",
"build": "babel server.js --out-file server.compiled.js",
},
"author": "",
"license": "ISC",
"dependencies": {
"#babel/cli": "^7.8.4",
"#babel/core": "^7.8.4",
"#babel/node": "^7.8.4",
"#babel/preset-env": "^7.8.4",
"#babel/preset-react": "^7.0.0-beta.40",
"#babel/register": "7.8.3",
"#material-ui/core": "^4.4.3",
"#salesforce-ux/design-system": "^2.10.2",
"#salesforce/design-system-react": "^0.10.16",
"aws-param-store": "^3.2.0",
"aws-sdk": "^2.594.0",
"axios": "^0.19.0",
"babel-eslint": "^10.0.3",
"babel-loader": "^8.0.6",
"babel-preset-es2015": "^6.24.1",
"body-parser": "^1.19.0",
"cors": "^2.8.5",
"crypto-js": "^3.1.9-1",
"dotenv": "^8.2.0",
"enzyme": "^3.10.0",
"express": "^4.17.1",
"express-sse": "^0.5.1",
"fs": "0.0.1-security",
"http": "0.0.0",
"https": "^1.0.0",
"jsforce": "^1.9.3",
"node-cache": "^5.1.0",
"path": "^0.12.7",
"prop-types": "^15.7.2",
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-router-dom": "^5.1.2",
"react-scripts": "^3.3.1",
"salesforce-signed-request": "0.0.1",
"validator": "^11.1.0",
"webpack-node-externals": "^1.7.2"
},
"devDependencies": {
"#salesforce/babel-preset-design-system-react": "^3.0.0",
"eslint": "^6.6.0",
"eslint-config-airbnb": "^18.0.1",
"eslint-plugin-import": "^2.18.2",
"eslint-plugin-jest": "^23.0.4",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-react": "^7.16.0",
"eslint-plugin-react-hooks": "^1.7.0",
"nodemon": "^1.19.2",
"npm-run-all": "^4.1.5",
"salesforce-signed-request": "0.0.1",
"webpack": "^4.41.5",
"webpack-cli": "^3.3.10",
"webpack-node-externals": "^1.7.2"
}
}
Any help or ideas would be awesome! I have spent the last couple days trying to nail down my errors and get babel configured!
I think in this particular case, i still had some webpack and package json files in the client folder. After porting over logic to a new app with webpack.server.js and package.json only living at root, i seem to have fixed the issue.

undefined is not an object (evaluating 'Component.propTypes') - React Native 0.61.5

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.

Preact.js - How to start a auto re run server like React.js does

I would like to use a development server just like React does with npm start. But, with Preact when I use the same command it opens a static server and I have to restart it manually each time when I want to see some change in my project.
My package.json:
{
"name": "yagoazedias-site",
"version": "0.0.0",
"description": "Ready-to-go Preact starter project powered by webpack.",
"scripts": {
"dev": "cross-env NODE_ENV=development webpack-dev-server --inline --hot --progress",
"start": "serve build -s -c 1",
"prestart": "npm run build",
"build": "cross-env NODE_ENV=production webpack --progress",
"prebuild": "mkdirp build && ncp src/assets build/assets",
"test": "npm run -s lint && jest --coverage",
"test:watch": "npm run -s test -- --watch",
"lint": "eslint src test"
},
"keywords": [
"preact",
"boilerplate",
"webpack"
],
"license": "MIT",
"author": "Jason Miller <jason#developit.ca>",
"jest": {
"setupFiles": [
"./test/setup.js"
],
"testURL": "http://localhost:8080",
"moduleFileExtensions": [
"js",
"jsx"
],
"moduleDirectories": [
"node_modules"
],
"moduleNameMapper": {
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js",
"\\.(css|less)$": "identity-obj-proxy",
"^react$": "preact-compat",
"^react-dom$": "preact-compat"
},
"collectCoverageFrom": [
"src/**/*.{js,jsx}"
]
},
"devDependencies": {
"autoprefixer": "^7.0.1",
"babel": "^6.5.2",
"babel-core": "^6.24.0",
"babel-eslint": "^7.2.2",
"babel-jest": "^20.0.0",
"babel-loader": "^7.0.0",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-react-jsx": "^6.8.0",
"babel-preset-es2015": "^6.24.0",
"babel-preset-stage-0": "^6.5.0",
"babel-register": "^6.24.0",
"babel-runtime": "^6.11.6",
"chai": "^4.0.2",
"copy-webpack-plugin": "^4.0.1",
"core-js": "^2.4.1",
"cross-env": "^5.0.1",
"css-loader": "^0.28.0",
"eslint": "^4.1.0",
"eslint-plugin-jest": "^20.0.0",
"eslint-plugin-react": "^7.0.0",
"extract-text-webpack-plugin": "^3.0.0",
"file-loader": "^0.11.1",
"html-webpack-plugin": "^2.28.0",
"identity-obj-proxy": "^3.0.0",
"jest": "^20.0.0",
"json-loader": "^0.5.4",
"less": "^2.7.1",
"less-loader": "^4.0.3",
"mkdirp": "^0.5.1",
"ncp": "^2.0.0",
"offline-plugin": "^4.7.0",
"postcss-loader": "^2.0.3",
"preact-jsx-chai": "^2.2.1",
"raw-loader": "^0.5.1",
"regenerator-runtime": "^0.10.3",
"replace-bundle-webpack-plugin": "^1.0.0",
"script-ext-html-webpack-plugin": "^1.3.4",
"sinon": "^2.1.0",
"sinon-chai": "^2.9.0",
"source-map-loader": "^0.2.1",
"style-loader": "^0.18.1",
"url-loader": "^0.6.1",
"webpack": "^3.0.0",
"webpack-dev-server": "^2.4.4"
},
"dependencies": {
"preact": "^8.1.0",
"preact-compat": "^3.15.0",
"preact-render-to-string": "^3.6.0",
"preact-router": "^2.5.1",
"promise-polyfill": "^6.0.2",
"proptypes": "^1.0.0",
"serve": "^6.0.0"
},
"main": "webpack.config.babel.js",
"directories": {
"test": "test"
}
}
Relevant links:
https://preactjs.com/
https://github.com/developit/preact
Use the dev script instead?
$ npm run dev
Your start script is doing serve build -s -c 1. React CRA's start script will boot up a webpack dev server which is what your dev script is doing.
npm start is short for npm run start. npm run <command> is just a small proxy that looks up the different commands you have listed in package.json.
Read more about npm scripts here.

Installation issue in: 'react-native-tab-view'

Main Error
"Couldn't find any versions for "react-native-background-geolocation-android" that matches "2.7.1" "
Environment
OS: macOS Sierra 10.12.5
Node: 6.11.0
Yarn: 1.0.2
npm: 5.3.0
Watchman: 4.9.0
Xcode: Version 8.3.3 (8E3004b)
Steps to Reproduce
I was trying to add the react-native-tab-view library in one of my existing project. So I did:
yarn add react-native-tab-view
inside my project directory.
Expected Behavior
The library should get installed/Add in my project.
Actual Behavior
It threw an unexpected error:
yarn add react-native-tab-view
yarn add v1.0.2
info No lockfile found.
[1/4] 🔍 Resolving packages...
warning polyline#0.2.0: This module is now under the #mapboxnamespace: install instead
warning connect#2.30.2: connect 2.x series is deprecated
warning node-uuid#1.4.7: Use uuid module instead
Couldn't find any versions for "react-native-background-geolocation-android" that matches "2.7.1"
? Please choose a version of "react-native-background-geolocation-android" from
this list: (Use arrow keys)
❯ 0.0.1-security
Screenshot 1:
Furthur
If I proceed by selecting the '0.0.1-security', I get an error in the installation.
Screenshot 2:
Get full error log: click here
Package.json file:
{
"name": "MyAppName",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest",
"build": "babel js/ -d lib/",
"prepublish": "npm run build",
"flow": "node_modules/.bin/flow",
"flow start": "flow start",
"flow stop": "flow stop",
"flow status": "flow status",
"flow coverage": "flow coverage"
},
"dependencies": {
"async": "^2.2.0",
"polyline": "^0.2.0",
"pusher-js": "4.1.0",
"react": "15.4.2",
"react-native": "0.42.3",
"react-native-animatable": "^1.1.1",
"react-native-appsee": "^2.3.32",
"react-native-background-geolocation-android": "2.7.1",
"react-native-checkbox": "^1.1.0",
"react-native-code-push": "^1.17.3-beta",
"react-native-device-info": "^0.10.1",
"react-native-fabric": "^0.4.1",
"react-native-file-transfer-android": "0.0.2",
"react-native-image-picker": "^0.26.2",
"react-native-maps": "^0.13.1",
"react-native-message-composer": "^1.0.0",
"react-native-newrelic": "^1.0.18",
"react-native-progress": "^3.2.0",
"react-native-push-notification": "^3.0.0",
"react-native-radio-buttons": "^0.14.0",
"react-native-router-flux": "^3.38.0",
"react-native-slack-webhook": "0.0.5",
"react-native-slider": "^0.9.1",
"react-native-sms-x": "^1.0.4",
"react-native-sound": "^0.9.1",
"react-native-tab-view": "^0.0.69",
"react-native-uploader": "0.0.10",
"react-redux": "^5.0.3",
"react-timer-mixin": "^0.13.3",
"redux": "^3.6.0",
"redux-logger": "^2.10.2",
"redux-persist": "^4.5.0",
"redux-thunk": "^2.2.0",
"socket.io": "^1.7.3"
},
"devDependencies": {
"babel-cli": "^6.24.1",
"babel-eslint": "^7.2.3",
"babel-jest": "19.0.0",
"babel-preset-flow": "^6.23.0",
"babel-preset-react-native": "1.9.1",
"babel-register": "^6.24.1",
"eslint": "^3.19.0",
"eslint-config-airbnb": "^15.0.1",
"eslint-plugin-import": "^2.3.0",
"eslint-plugin-react": "^7.0.1",
"eslint-plugin-react-native": "^2.3.2",
"flow-bin": "^0.37.0",
"install": "^0.10.1",
"jest": "19.0.2",
"npm": "^4.6.1",
"react-test-renderer": "15.4.2"
},
"jest": {
"preset": "react-native"
}
}
Did you explicitly selected react-native-background-geolocation-android's version to 2.7.1?
There is no release with the version number 2.7.1 on that library. If you change it to 2.7.0 or a newer version of the library and then run the command yarn add react-native-tab-view it will be installed.
You can find the release numbers of react-native-background-geolocation-android here

Categories

Resources