I've cloned the react-native-hackathon-starter repo, wrote my own little app and tried to build an apk for debug using gradle assembleDebug, but I get this exception:
path\to\project\android\build\intermediates\exploded-aar\com.google.android.gms\play-services-base\10.2.1\res\drawable\common_google_signin_btn_icon_dark_normal.xml:3:29-91 : No resource found that matches the given name (at 'drawable' with value '#drawable/common_google_signin_btn_icon_dark_normal_background').
path\to\project\android\build\intermediates\exploded-aar\com.google.android.gms\play-services-base\10.2.1\res\drawable\common_google_signin_btn_icon_light_normal.xml:3:29-92 : No resource found that matches the given name (at 'drawable' with value '#drawable/common_google_signin_btn_icon_light_normal_background').
path\to\project\android\build\intermediates\exploded-aar\com.google.android.gms\play-services-base\10.2.1\res\drawable\common_google_signin_btn_text_dark_normal.xml:3:29-91 : No resource found that matches the given name (at 'drawable' with value '#drawable/common_google_signin_btn_text_dark_normal_background').
path\to\project\android\build\intermediates\exploded-aar\com.google.android.gms\play-services-base\10.2.1\res\drawable\common_google_signin_btn_text_light_normal.xml:3:29-92 : No resource found that matches the given name (at 'drawable' with value '#drawable/common_google_signin_btn_text_light_normal_background').
FAILED
FAILURE: Build failed with an exception.
What went wrong:
Execution failed for task ':react-native-firestack:processReleaseResources'.
com.android.ide.common.process.ProcessException: org.gradle.process.internal.ExecException: Process 'command 'C:\Users\my_user\AppData\Local\Android\android-sdk\build-tools\23.0.1\aapt.exe'' finished with non-zero exit value 1
Try:
Run with --info or --debug option to get more log output.
Exception is:
org.gradle.api.tasks.TaskExecutionException: Execution failed for task ':react-native-firestack:processReleaseResources'.
From what I can tell, it's missing some graphical resources. I've tried gradlew clean before assemble, it still doesn't fix the issue.
Someone else has the same issue as me.
My package.json:
{
"name": "HackathonStarter",
"version": "0.0.2",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"firebase": "^3.6.7",
"native-base": "^2.1.0",
"react-addons-update": "^15.4.2",
"react-native-easy-grid": "^0.1.8",
"react-native-firestack": "^2.3.9",
"react-native-router-flux": "^3.37.0",
"react-native-svg": "^5.1.7",
"redux-thunk": "^2.2.0",
"jest-react-native": "^18.0.0",
"lodash": "^4.17.4",
"react": "~15.5.4",
"react-native": "0.43.4",
"react-native-elements": "^0.11.2",
"react-native-vector-icons": "^4.0.0",
"react-redux": "^5.0.1",
"redux": "^3.6.0"
},
"devDependencies": {
"babel-jest": "19.0.0",
"babel-preset-react-native": "1.9.1",
"jest": "19.0.2",
"react-test-renderer": "~15.5.4"
},
"jest": {
"preset": "react-native"
}
}
Does anyone have any idea how to fix this?
After deleting the node_modules folder, doing another npm install, removing node_modules/react-native-router-flux/react-native and editing out
compile 'com.google.android.gms:play-services-base:+
from node_modules/react-native-firestack/android/build.gradle, because it was causing interference with the gms dependency in my root build.gradle, I was able to do a gradlew assembleDebug and assembleRelease.
I think there was a problem with the firestack package, not bundling assets together correctly or whatever. All good now.
Related
Hi I am facing issue with react-native-neomorph-shadows library. App crashes immediately after build being successful. I am not sure what is the issue.
macOS version: 11.2.3
Edit-1
Package.json dependency:
"#react-native-community/art": "^1.2.0",
"#react-native-community/masked-view": "^0.1.11",
"#react-navigation/bottom-tabs": "^5.11.13",
"#react-navigation/native": "^5.9.4",
"#react-navigation/stack": "^5.14.5",
"react": "17.0.1",
"react-native": "0.64.2",
"react-native-gesture-handler": "^1.10.3",
"react-native-linear-gradient": "^2.5.6",
"react-native-neomorph-shadows": "^1.0.0",
"react-native-reanimated": "^2.2.0",
"react-native-safe-area-context": "^3.2.0",
"react-native-screens": "^3.4.0"
Error:
error: Error: Unable to resolve module ./src/ShadowFlex from /Users/manikanttiwari/Desktop/test/app/node_modules/react-native-neomorph-shadows/index.js
Hi I was able to solve this problem. Please do npm i https://github.com/react-native-art/art.git instead of react-native link #react-native-community/art. This will solve the problem.
I have been looking for the solution about this issue, but I couldn't find it until now.
It is such a weird issue.
I tried with react-native 0.56.0 at first, it compiles well, and then this error is occured on the android device.
firestore(5.5.0) could not reach backend
However, the problem is that the error doesn't happen to android simulator. It only happens to android device. (It's really weird)
So, I tried with react-native 0.57.1 in this time, then this error occured.
And it's printed that The development server returned response error code: 500 on android device screen.
error: bundling failed: Error: Unable to resolve module schedule/tracking from /Users/jeonmingyu/work/foodup-mobile-RN/node_modules/react-native/Libraries/Renderer/oss/ReactNativeRenderer-dev.js: Module schedule/tracking does not exist in the Haste module map
This might be related to https://github.com/facebook/react-native/issues/4968
To resolve try the following:
1. Clear watchman watches: watchman watch-del-all.
2. Delete the node_modules folder: rm -rf node_modules && npm install.
3. Reset Metro Bundler cache: rm -rf /tmp/metro-bundler-cache-* or npm start -- --reset-cache.
4. Remove haste cache: rm -rf /tmp/haste-map-react-native-packager-*.
at ModuleResolver.resolveDependency (/Users/jeonmingyu/work/foodup-mobile-RN/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:209:1301)
at ResolutionRequest.resolveDependency (/Users/jeonmingyu/work/foodup-mobile-RN/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:83:16)
at DependencyGraph.resolveDependency (/Users/jeonmingyu/work/foodup-mobile-RN/node_modules/metro/src/node-haste/DependencyGraph.js:238:485)
at Object.resolve (/Users/jeonmingyu/work/foodup-mobile-RN/node_modules/metro/src/lib/transformHelpers.js:180:25)
at dependencies.map.result (/Users/jeonmingyu/work/foodup-mobile-RN/node_modules/metro/src/DeltaBundler/traverseDependencies.js:311:29)
at Array.map ()
at resolveDependencies (/Users/jeonmingyu/work/foodup-mobile-RN/node_modules/metro/src/DeltaBundler/traverseDependencies.js:307:16)
at /Users/jeonmingyu/work/foodup-mobile-RN/node_modules/metro/src/DeltaBundler/traverseDependencies.js:164:33
at Generator.next ()
at step (/Users/jeonmingyu/work/foodup-mobile-RN/node_modules/metro/src/DeltaBundler/traverseDependencies.js:266:307)
Here's my package.json
package.json
"dependencies": {
"#firebase/firestore": "^0.8.1",
"firebase": "^5.5.1",
"immutable": "^3.8.2",
"loaders.css": "^0.1.2",
"lodash": "^4.17.10",
"moment": "^2.22.2",
"native-base": "^2.7.2",
"react": "16.3.1",
"react-geocode": "^0.1.2",
"react-loaders": "^3.0.1",
"react-native": "^0.57.0",
"react-native-app-intro-slider": "^0.2.4",
"react-native-fast-image": "^4.0.14",
"react-native-loader": "^1.2.1",
"react-native-maps": "^0.21.0",
"react-native-phone-call": "^1.0.7",
"react-native-side-menu": "^1.1.3",
"react-native-swiper": "^1.5.13",
"react-navigation": "^2.3.1",
"react-redux": "^5.0.7",
"react-redux-firebase": "^2.1.6",
"redux": "^4.0.0",
"redux-actions": "^2.4.0",
"redux-devtools-extension": "^2.13.5",
"redux-firestore": "^0.5.7",
"redux-persist": "^5.10.0",
"redux-thunk": "^2.3.0",
"remote-redux-devtools": "^0.5.13"
},
"devDependencies": {
"babel-jest": "23.0.1",
"babel-preset-react-native": "^5.0.2",
"jest": "23.1.0",
"lint-staged": "^7.2.2",
"node-sass": "^4.9.2",
"react-native-sass-transformer": "^1.2.2",
"react-test-renderer": "16.3.1",
"redux-devtools-extension": "^2.13.5"
}
If anyone knows about it and has solution, please share your solution.
It drives me crazy! :(
I am not able to do:
import SimpleSchema from 'simpl-schema';
or to import any other npm package with this command. I have already installed the package via meteor npm install --save simpl-schema.
I have also tried to import other npm dependencies like:
import moment from 'moment';
Therefore, I think that I generally missed something important to be able to require NPM packages in my client-side code or that I am using a wrong structure?
I get the error:
Uncaught SyntaxError: Unexpected identifier
in the browser console.
Edit
I have called meteor npm install before running the app.
If I code this line import moment from 'moment'; on a server side js-file, I get the following error:
app\server\startup\profilemanagement.js:1
(function(NPM,Assets){(function(){import moment from 'moment';
SyntaxError: Unexpected token import at C:...meteor\local\build\programs\server\boot.js:392:18 at
Array.forEach () at Function..each..forEach
(C:...meteor\packages\meteor-tool\1.6.0:1\mt-os.windows.x86_64\dev_bundle\server-lib\node_modules\underscore\underscore.js:79:11) at C:...meteor\local\build\programs\server\boot.js:220:5 at
C:...meteor\local\build\programs\server\boot.js:463:5 at
Function.run
(C:...meteor\local\build\programs\server\profile.js:510:12) at
C:...meteor\local\build\programs\server\boot.js:462:11
I am not sure if I installed the babel packages correctly. I think something went wrong there. Here is my package.json:
{
"dependencies": {
"abbrev": "^1.1.0",
"addressparser": "^1.0.1",
"ajv": "^5.2.2",
"ansi-regex": "^3.0.0",
"aproba": "^1.2.0",
"are-we-there-yet": "^1.1.4",
"asn1": "^0.2.3",
"assert-plus": "^1.0.0",
"asynckit": "^0.4.0",
"aws-sign2": "^0.7.0",
"aws4": "^1.6.0",
"babel-runtime": "^6.26.0",
"balanced-match": "^1.0.0",
"bcrypt": "^1.0.3",
"bcrypt-pbkdf": "^1.0.1",
"block-stream": "0.0.9",
"boom": "^5.2.0",
"brace-expansion": "^1.1.8",
"buildmail": "^4.0.1",
"caseless": "^0.12.0",
"chart.js": "^2.7.0",
"chartjs-color": "^2.2.0",
"cloudinary": "^1.9.0",
"co": "^4.6.0",
"code-point-at": "^1.1.0",
"color-convert": "^1.9.0",
"color-name": "^1.1.3",
"combined-stream": "^1.0.5",
"concat-map": "0.0.1",
"console-control-strings": "^1.1.0",
"core-js": "^2.5.1",
"core-util-is": "^1.0.2",
"cryptiles": "^3.1.2",
"dashdash": "^1.14.1",
"debug": "^3.0.1",
"deep-extend": "^0.5.0",
"delayed-stream": "^1.0.0",
"delegates": "^1.0.0",
"ecc-jsbn": "^0.1.1",
"extend": "^3.0.1",
"extsprintf": "^1.3.0",
"fast-deep-equal": "^1.0.0",
"fontawesome": "^4.7.2",
"forever-agent": "^0.6.1",
"form-data": "^2.3.1",
"fs.realpath": "^1.0.0",
"fstream": "^1.0.11",
"fstream-ignore": "^1.0.5",
"gauge": "^2.7.4",
"getpass": "^0.1.7",
"glob": "^7.1.2",
"graceful-fs": "^4.1.11",
"har-schema": "^2.0.0",
"har-validator": "^5.0.3",
"has-unicode": "^2.0.1",
"hawk": "^6.0.2",
"hoek": "^4.2.0",
"http-signature": "^1.2.0",
"iconv-lite": "^0.4.19",
"inflight": "^1.0.6",
"inherits": "^2.0.3",
"ini": "^1.3.4",
"is-fullwidth-code-point": "^2.0.0",
"is-typedarray": "^1.0.0",
"isarray": "^2.0.2",
"isstream": "^0.1.2",
"jasny-bootstrap": "^3.1.3",
"jodid25519": "^1.0.2",
"jsbn": "^1.1.0",
"json-schema": "^0.2.3",
"json-schema-traverse": "^0.3.1",
"json-stable-stringify": "^1.0.1",
"json-stringify-safe": "^5.0.1",
"jsonify": "0.0.0",
"jsprim": "^1.4.1",
"libbase64": "^0.2.0",
"libmime": "^3.1.0",
"libqp": "^1.1.0",
"lodash": "^4.17.4",
"mailcomposer": "^4.0.2",
"meteor-node-stubs": "^0.2.11",
"mime-db": "^1.30.0",
"mime-types": "^2.1.17",
"minimatch": "^3.0.4",
"minimist": "^1.2.0",
"mkdirp": "^0.5.1",
"moment": "^2.18.1",
"ms": "^2.0.0",
"nan": "^2.7.0",
"node-pre-gyp": "^0.6.37",
"nodemailer": "^4.1.0",
"nodemailer-fetch": "^2.1.0",
"nodemailer-shared": "^2.0.0",
"nopt": "^4.0.1",
"npmlog": "^4.1.2",
"number-is-nan": "^1.0.1",
"oauth-sign": "^0.8.2",
"object-assign": "^4.1.1",
"object-inspect": "^1.3.0",
"object-keys": "^1.0.11",
"once": "^1.4.0",
"os-homedir": "^1.0.2",
"os-tmpdir": "^1.0.2",
"osenv": "^0.1.4",
"path-is-absolute": "^1.0.1",
"path-parse": "^1.0.5",
"performance-now": "^2.1.0",
"process-nextick-args": "^1.0.7",
"punycode": "^2.1.0",
"q": "^1.5.0",
"qs": "^6.5.1",
"rc": "^1.2.1",
"readable-stream": "^2.3.3",
"regenerator-runtime": "^0.11.0",
"request": "^2.82.0",
"resolve": "^1.4.0",
"resumer": "0.0.0",
"rimraf": "^2.6.2",
"safe-buffer": "^5.1.1",
"semver": "^5.4.1",
"set-blocking": "^2.0.0",
"signal-exit": "^3.0.2",
"sntp": "^2.0.2",
"sshpk": "^1.13.1",
"string-width": "^2.1.1",
"string.prototype.trim": "^1.1.2",
"string_decoder": "^1.0.3",
"stringstream": "0.0.5",
"strip-ansi": "^4.0.0",
"strip-json-comments": "^2.0.1",
"sweetalert": "^1.1.3",
"tape": "^4.8.0",
"tar": "^4.0.1",
"tar-pack": "^3.4.0",
"through": "^2.3.8",
"tough-cookie": "^2.3.2",
"tunnel-agent": "^0.6.0",
"tweetnacl": "^1.0.0",
"uid-number": "0.0.6",
"util-deprecate": "^1.0.2",
"uuid": "^3.1.0",
"verror": "^1.10.0",
"wide-align": "^1.1.2",
"wow.js": "^1.2.2",
"wrappy": "^1.0.2",
"yallist": "^3.0.2"
}
}
Second edit
It seems to be that (maybe since the last update?) I have a major issue with the meteor installation and its npm dependencies. I am not able to create a new meteor project due to this error:
Error: Error: Could not install npm dependencies for test-packages:
Command failed: C:\WINDOWS\system32\cmd.exe /c
C:\Users...\AppData\Local.meteor\packages\meteor-tool\1.6.0._1\mt-os.windows.x86_64\dev_bundle\bin\npm.cmd
install npm ERR! code ENOGIT npm ERR! No git binary found in $PATH npm
ERR! npm ERR! Failed using git. npm ERR! Please check if you have git
installed and in your PATH.
You can check this error here:
https://github.com/meteor/meteor/issues/8585. It tells that me that no Npm dependencies can be installed because of not finding the Git-path.
However, the solutiuon to reinstall Git did not work for me. So, I think something went generally wrong since the last meteor update. Maybe the only solution is to reinstall meteor completely or use an older version? I started this project from my computer with an older meteor version and uninstalling and reinstalling Babel did not make any difference.
Ok, got it! Although I don´t know exactly what produced the error, I could solve the issue by creating a new meteor project with the --bare flag (so now I know that all npm dependencies are installed correctly to ensure that I can use 'import') and copied my code into the project. However, than I got another error message which told me that my bootstrap is not compatible with my jquery version. Before solving this, I had to delete codemirror in my client/vendor folder, which produces another error
Uncaught Error: Cannot find module ‘…/…/lib/codemirror’
Than I installed jquery#2.2.4 plus all required datatable npm dependencies I use in my code to keep the compatibility of my applied bootstrap and jquery. Now I can use import SimpleSchema from 'simpl-schema' and all other imports and no more errors occure.
So lastly, some npm and/or packages were wrong and the initial error could be solved by creating a new meteor project. The other errors were related to bootstrap/jquery compatibility and codemirror.
I'm following this tutorial on building a React app on top of WordPress, and I'm having trouble starting it.
I modified package.json file a bit and webpack.config.js` and I am getting the following error in my terminal
➜ wp-api git:(development) ✗ npm start
> wp-api#1.0.0 start /Users/myuser/Projects/wp-api
> webpack-dev-server --open
Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.resolve has an unknown property 'modulesDirectories'. These properties are valid:
object { alias?, aliasFields?, cachePredicate?, descriptionFiles?, enforceExtension?, enforceModuleExtension?, extensions?, fileSystem?, mainFields?, mainFiles?, moduleExtensions?, modules?, plugins?, resolver?, symlinks?, unsafeCache?, useSyncFileSystemCalls? }
- configuration.resolve.extensions[0] should not be empty.
npm ERR! Darwin 16.5.0
npm ERR! argv "/usr/local/Cellar/node/7.10.0/bin/node" "/usr/local/bin/npm" "start"
npm ERR! node v7.10.0
npm ERR! npm v4.2.0
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! wp-api#1.0.0 start: `webpack-dev-server --open`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the wp-api#1.0.0 start script 'webpack-dev-server --open'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the wp-api package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! webpack-dev-server --open
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs wp-api
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls wp-api
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:
npm ERR! /Users/myuser/.npm/_logs/2017-05-15T07_40_36_249Z-debug.log
The log file is
0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/Cellar/node/7.10.0/bin/node',
1 verbose cli '/usr/local/bin/npm',
1 verbose cli 'start' ]
2 info using npm#4.2.0
3 info using node#v7.10.0
4 verbose run-script [ 'prestart', 'start', 'poststart' ]
5 info lifecycle wp-api#1.0.0~prestart: wp-api#1.0.0
6 silly lifecycle wp-api#1.0.0~prestart: no script for prestart, continuing
7 info lifecycle wp-api#1.0.0~start: wp-api#1.0.0
8 verbose lifecycle wp-api#1.0.0~start: unsafe-perm in lifecycle true
9 verbose lifecycle wp-api#1.0.0~start: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bin:/Users/myuser/Projects/wp-api/node_modules/.bin:/Users/myuser/.rbenv/shims:/Users/myuser/.rbenv/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/opt/X11/bin
10 verbose lifecycle wp-api#1.0.0~start: CWD: /Users/myuser/Projects/wp-api
11 silly lifecycle wp-api#1.0.0~start: Args: [ '-c', 'webpack-dev-server --open' ]
12 silly lifecycle wp-api#1.0.0~start: Returned: code: 1 signal: null
13 info lifecycle wp-api#1.0.0~start: Failed to exec start script
14 verbose stack Error: wp-api#1.0.0 start: `webpack-dev-server --open`
14 verbose stack Exit status 1
14 verbose stack at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/lib/utils/lifecycle.js:279:16)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at EventEmitter.emit (events.js:194:7)
14 verbose stack at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/lib/utils/spawn.js:40:14)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at ChildProcess.emit (events.js:194:7)
14 verbose stack at maybeClose (internal/child_process.js:899:16)
14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
15 verbose pkgid wp-api#1.0.0
16 verbose cwd /Users/myuser/Projects/wp-api
17 error Darwin 16.5.0
18 error argv "/usr/local/Cellar/node/7.10.0/bin/node" "/usr/local/bin/npm" "start"
19 error node v7.10.0
20 error npm v4.2.0
21 error code ELIFECYCLE
22 error errno 1
23 error wp-api#1.0.0 start: `webpack-dev-server --open`
23 error Exit status 1
24 error Failed at the wp-api#1.0.0 start script 'webpack-dev-server --open'.
24 error Make sure you have the latest version of node.js and npm installed.
24 error If you do, this is most likely a problem with the wp-api package,
24 error not with npm itself.
24 error Tell the author that this fails on your system:
24 error webpack-dev-server --open
24 error You can get information on how to open an issue for this project with:
24 error npm bugs wp-api
24 error Or if that isn't available, you can get their info via:
24 error npm owner ls wp-api
24 error There is likely additional logging output above.
25 verbose exit [ 1, true ]
The package.json and webpack.config.js are:
{
"name": "wp-api",
"version": "1.0.0",
"description": "React based WordPress app",
"main": "index.js",
"dependencies": {
"alt": "^0.18.6",
"axios": "^0.15.3",
"extract-text-webpack-plugin": "^2.1.0",
"lodash": "^4.17.4",
"node-sass": "^4.5.2",
"prop-types": "^15.5.8",
"react": "^15.4.2",
"react-dom": "^15.4.2",
"react-router": "^3.0.1",
"sass-loader": "^6.0.3"
},
"devDependencies": {
"babel-core": "^6.21.0",
"babel-loader": "^6.2.10",
"babel-preset-env": "^1.4.0",
"babel-preset-es2015": "^6.18.0",
"babel-preset-react": "^6.24.1",
"css-loader": "^0.28.0",
"firebase-tools": "^3.6.1",
"html-webpack-plugin": "^2.28.0",
"react-hot-loader": "^1.3.1",
"style-loader": "^0.16.1",
"webpack": "^2.4.1",
"webpack-dev-server": "^2.4.2"
},
"scripts": {
"start": "webpack-dev-server --open",
"test": "echo \"Error: no test specified\" && exit 1"
},
"babel": {
"presets": [
"env",
"react"
]
},
"author": "dingo-d",
"license": "GPL"
}
and
var webpack = require('webpack');
var path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const outputCss = 'styles/[name].css';
var config = {
devtool: 'inline-source-map', // This will show line numbers where errors are accured in the terminal
devServer: {
historyApiFallback: true, // This will make the server understand "/some-link" routs instead of "/#/some-link"
},
entry: [
'webpack-dev-server/client?http://127.0.0.1:8080/', // Specify the local server port
'webpack/hot/only-dev-server', // Enable hot reloading
'./src/index' // This is where Webpack will be looking for the entry index.js file
],
output: {
path: path.join(__dirname, 'public'), // This is used to specify folder for producion bundle. Will not be used here, but it's a good practice to have it
filename: 'bundle.js' // Filename for production bundle
// publicPath: '/'
},
resolve: {
modulesDirectories: ['node_modules', 'src'], // Folders where Webpack is going to look for files to bundle together
extensions: ['', '.js'] // Extensions that Webpack is going to expect
},
module: {
// Loaders allow you to preprocess files as you require() or “load” them. Loaders are kind of like “tasks” in other build tools, and provide a powerful way to handle frontend build steps.
loaders: [
{
test: /\.jsx?$/, // Here we're going to use JS for react components but including JSX in case this extension is prefered
exclude: /node_modules/, // Speaks for itself
loaders: ['react-hot', 'babel?presets[]=react,presets[]=es2015'] // Modules that help with hot reloading and ES6 transcription
}
],
rules: [
{ test: /\.(js)$/, use: 'babel-loader' },
{
test: /\.scss$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [
{
loader: 'css-loader'
},
{
loader: 'sass-loader'
}
]
})
}
]
},
plugins: [
new webpack.HotModuleReplacementPlugin(), // Hot reloading
new webpack.NoErrorsPlugin(), // Webpack will let you know if there are any errors
new HtmlWebpackPlugin({
template: 'index.html'
}),
]
}
module.exports = config;
I haven't done much projects with webpack, so my knowledge in this aspect is very limited.
What am I doing wrong? I tried deleting the node_modules folder and running npm install again, but that didn't work.
Solution to the 1st problem:
npm uninstall webpack --save-dev
npm install webpack#2.1.0-beta.22 --save-dev
Solution to the
configuration.resolve.extensions[0] should not be empty. :
Remove '' from the array
resolve: {
modulesDirectories: ['node_modules', 'src'], // Folders where Webpack is going to look for files to bundle together
extensions: ['.js'] // Extensions that Webpack is going to expect
},
Or replace it with '*'
resolve: {
modulesDirectories: ['node_modules', 'src'], // Folders where Webpack is going to look for files to bundle together
extensions: ['*','.js'] // Extensions that Webpack is going to expect
},
I've been having this issue for the last couple of days and was able to narrow down the culprit just today:
Starting with a brand new project, and adding firebase to it:
ionic start -a "MyApp" -i com.package.xyz MyApp tabs --v2
npm install --save firebase
At this point, ionic serve works correctly. But if I import firebase in any file:
import firebase from 'firebase';
Now running ionic serve --debug throws the following errors:
******************************************************
Dependency warning - for the CLI to run correctly,
it is highly recommended to install/upgrade the following:
Install ios-sim to deploy iOS applications.`npm install -g ios-sim` (may require sudo)
Install ios-deploy to deploy iOS applications to devices. `npm install -g ios-deploy` (may require sudo)
******************************************************
> ionic-hello-world# ionic:serve /Users/Desktop/Projects/MyApp
> ionic-app-scripts serve "--debug"
[13:27:37] ionic-app-scripts 0.0.45
[ DEBUG! ] An BuildUpdateStarted event occurred MEM: 116.7MB
[ DEBUG! ] An BuildUpdateCompleted event occurred MEM: 116.7MB
[ DEBUG! ] An FileChange event occurred MEM: 116.9MB
[ DEBUG! ] An ReloadApp event occurred MEM: 116.9MB
[13:27:38] watch started ... MEM: 117.2MB
[13:27:38] build dev started ... MEM: 117.2MB
[13:27:38] clean started ... MEM: 117.2MB
[ DEBUG! ] clean /Users/Desktop/Projects/MyApp/www/build MEM: 117.2MB
[13:27:38] clean finished in 6 ms MEM: 117.4MB
[13:27:38] copy started ... MEM: 117.4MB
[13:27:38] transpile started ... MEM: 117.5MB
[13:27:42] build dev failed: Cannot read property 'indexOf' of undefined MEM: 253.7MB
[ DEBUG! ] TypeError: Cannot read property 'indexOf' of undefined at loadDiagnostic
(/Users/Desktop/Projects/MyApp/node_modules/#ionic/app-scripts/dist/logger/logger-typescript.js:47:27)
at
/Users/Desktop/Projects/MyApp/node_modules/#ionic/app-scripts/dist/logger/logger-typescript.js:12:16
at Array.map (native) at Object.runTypeScriptDiagnostics
(/Users/Desktop/Projects/MyApp/node_modules/#ionic/app-scripts/dist/logger/logger-typescript.js:11:26)
at /Users/Desktop/Projects/MyApp/node_modules/#ionic/app-scripts/dist/transpile.js:92:47 at
transpileWorker
(/Users/Desktop/Projects/MyApp/node_modules/#ionic/app-scripts/dist/transpile.js:62:12) at
Object.transpile
(/Users/Desktop/Projects/MyApp/node_modules/#ionic/app-scripts/dist/transpile.js:26:12) at
buildDev
(/Users/Desktop/Projects/MyApp/node_modules/#ionic/app-scripts/dist/build.js:84:24) at
buildWorker
(/Users/Desktop/Projects/MyApp/node_modules/#ionic/app-scripts/dist/build.js:35:12) at
Object.build
(/Users/Desktop/Projects/MyApp/node_modules/#ionic/app-scripts/dist/build.js:19:12)
MEM: 253.7MB
[ DEBUG! ] listening on 8100 MEM: 253.9MB
[ DEBUG! ] watcher ready:
/Users/Desktop/Projects/MyApp/Users/Desktop/Projects/MyApp/src/assets/,/Users/Desktop/Projects/MyApp/src/index.html,/Users/Desktop/Projects/MyApp/src/manifest.json,/Users/Desktop/Projects/MyApp/src/service-worker.js,node_modules/ionic-angular/polyfills/polyfills.js,node_modules/ionicons/dist/fonts/
MEM: 253.8MB
[13:27:42] copy finished in 3.69 s MEM: 253.8MB
[ DEBUG! ] watcher ready:
/Users/Desktop/Projects/MyApp/Users/Desktop/Projects/MyApp/src/**/*.(ts|html|scss)
MEM: 253.8MB
[13:27:42] watch ready in 3.70 s MEM: 253.8MB
[13:27:42] dev server running: http://localhost:8100/
If I remove the import, ionic serve works correctly again.
Here is the output of ionic info:
Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.14
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.45
ios-deploy version: Not installed
ios-sim version: Not installed
OS: macOS Sierra
Node Version: v6.7.0
Xcode version: Not installed
How can I correct this error?
Asim
EDIT
I've traced the error down to node_modules/firebase/firebase.d.ts in the last section which says:
declare module 'firebase' {
export = firebase;
}
For this, the compiler complains: Duplicate identifier 'export='.
If I remove this section, or the export = firebase; line, the error goes away and ionic serve works fine, but I lose access to the firebase object.
Even more oddly, if I start with a blank project with only firebase added, and run ionic serve, things work fine. Next, I import firebase in one of my source files and everything works fine still. Until I terminate ionic serve and restart it. At that point, I get the same error as the one listed near the top of the post.
I've even updated my node, ionic, cordova and ionic-app-scripts. ionic info now shows:
Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.14
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.46
ios-deploy version: Not installed
ios-sim version: Not installed
OS: macOS Sierra
Node Version: v6.9.1
Xcode version: Not installed
Still the same issue though. I desperately need help to resolve this issue.. =/
EDIT
For more info:
tsconfig.json
{
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"declaration": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [
"dom",
"es2015"
],
"module": "es2015",
"moduleResolution": "node",
"sourceMap": true,
"target": "es5"
},
"include": [
"src/**/*.ts"
],
"exclude": [
"node_modules"
],
"compileOnSave": false,
"atom": {
"rewriteTsconfig": false
}
}
package.json
{
"name": "ionic-hello-world",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve"
},
"dependencies": {
"#angular/common": "2.1.1",
"#angular/compiler": "2.1.1",
"#angular/compiler-cli": "2.1.1",
"#angular/core": "2.1.1",
"#angular/forms": "2.1.1",
"#angular/http": "2.1.1",
"#angular/platform-browser": "2.1.1",
"#angular/platform-browser-dynamic": "2.1.1",
"#angular/platform-server": "2.1.1",
"#ionic/app-scripts": "0.0.46",
"#ionic/storage": "1.1.6",
"firebase": "^3.6.2",
"ionic-angular": "2.0.0-rc.3",
"ionic-native": "2.2.3",
"ionicons": "3.0.0",
"lodash": "^4.17.2",
"rxjs": "5.0.0-beta.12",
"uuid": "^3.0.1",
"zone.js": "0.6.26"
},
"devDependencies": {
"#ionic/app-scripts": "0.0.45",
"typescript": "2.0.6"
},
"cordovaPlugins": [
"cordova-plugin-whitelist",
"cordova-plugin-statusbar",
"cordova-plugin-console",
"cordova-plugin-device",
"cordova-plugin-splashscreen",
"ionic-plugin-keyboard"
],
"cordovaPlatforms": [
"ios",
{
"platform": "ios",
"version": "",
"locator": "ios"
}
],
"description": "An Ionic project"
}
npm versions
npm#3.10.8
cordova#6.4.0
ionic#2.1.14
typescript#2.0.10
firebase#3.6.2
I have the Same Problem look here:
https://forum.ionicframework.com/t/build-dev-failed-cannot-read-property-indexof-of-undefined/71506