I have an app that is hosted in an AWS S3 bucket, that uses a REST API to communicate to the back end which invokes Lambda functions via API Gateway.
I’ve recently ported the app over to use the new AWS-Amplify library to handle the authentication. Debugging and testing locally on my machine everything works fine. However, when I run a production build and push that up to the bucket and test my app in a browser I’m presented with a white screen and nothing else.
Checking the logs in the browser I get the following error
Uncaught Error: Cannot use e "__Schema" from another module or realm.
Ensure that there is only one instance of "graphql" in the node_modules
directory. If different versions of "graphql" are the dependencies of other
relied on modules, use "resolutions" to ensure only one version is installed.
After some googling I reckon the problem is down to whatever Ionic is using for minification when building with the --prod flag. If I run a dev build and deploy that, everything works fine, and like I said earlier, serving locally is all fine too. Also I should state that before using AWS-Amplify, everything worked fine.
Anyone else used Amplify in an Ionic app? Anyone had similar issues?
I’m using v3.20 of ionic cli. My package.json looks like this:
{
"name": "MyApp",
"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"config": {
"ionic_source_map_type": "source-map",
"ionic_webpack": "./config/webpack.config.js",
"ionic_watch": "./config/watch.config.js"
},
"scripts": {
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"lint": "ionic-app-scripts lint",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve",
},
"dependencies": {
"@angular/common": "5.0.3",
"@angular/compiler": "5.0.3",
"@angular/compiler-cli": "5.0.3",
"@angular/core": "5.0.3",
"@angular/forms": "5.0.3",
"@angular/http": "5.0.3",
"@angular/platform-browser": "5.0.3",
"@angular/platform-browser-dynamic": "5.0.3",
"@ionic-native/core": "4.4.0",
"@ionic-native/splash-screen": "4.4.0",
"@ionic-native/status-bar": "4.4.0",
"@ionic/storage": "2.1.3",
"@ngrx/core": "1.2.0",
"@ngrx/effects": "5.0.0",
"@ngrx/store": "4.1.1",
"aws-amplify": "^0.4.3",
"aws-amplify-angular": "^0.1.3",
"ionic-angular": "3.9.2",
"ionicons": "3.0.0",
"moment": "^2.22.2",
"moment-recur-ts": "^1.3.1",
"rxjs": "5.5.5",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.18"
},
"devDependencies": {
"@ionic/app-scripts": "3.1.5",
"@types/node": "8.10.19",
"typescript": "2.4.2",
"webpack-merge": "^4.1.1"
}
}