IONIC2 Apollo Graphql Eror: Cannot find name 'AsyncIterator' - ionic2

im starting develop ionic app using graphql service but im got some problem in nodes modules, how can i solve this?
[14:32:44] typescript: D:/ionic/node_modules/#types/graphql/subscription/subscribe.d.ts, line: 17
Cannot find name 'AsyncIterator'.
L16: subscribeFieldResolver?: GraphQLFieldResolver<any, any>
L17: ): AsyncIterator<ExecutionResult>;
[14:32:44] typescript: D:/ionic/node_modules/#types/graphql/subscription/subscribe.d.ts, line: 29
Cannot find name 'AsyncIterable'.
L28: fieldResolver?: GraphQLFieldResolver<any, any>
L29: ): AsyncIterable<any>;
this my package.json
{
"name": "Test",
"author": "test,
"homepage": "http://test.com",
"private": true,
"scripts": {
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve"
},
"dependencies": {
"#angular/common": "2.4.8",
"#angular/compiler": "2.4.8",
"#angular/compiler-cli": "2.4.8",
"#angular/core": "2.4.8",
"#angular/forms": "2.4.8",
"#angular/http": "2.4.8",
"#angular/platform-browser": "2.4.8",
"#angular/platform-browser-dynamic": "2.4.8",
"#angular/platform-server": "2.4.8",
"#ionic/storage": "^1.1.9",
"angular2-jwt": "^0.1.28",
"apollo-angular": "^0.13.0",
"apollo-client": "^1.9.1",
"graphql-tag": "^2.4.2",
"ionic-angular": "^2.1.0",
"ionic-native": "2.5.1",
"ionicons": "3.0.0",
"rxjs": "5.2.0",
"sw-toolbox": "3.6.0",
"zone.js": "0.7.7"
},
"devDependencies": {
"#ionic/app-scripts": "^2.1.4",
"typescript": "^2.3.4"
},
"cordovaPlugins": [
"ionic-plugin-keyboard",
"cordova-plugin-whitelist",
"cordova-plugin-console",
"cordova-plugin-statusbar",
"cordova-plugin-device",
"cordova-plugin-splashscreen",
"cordova-plugin-camera",
"cordova-plugin-app-version"
],
"cordovaPlatforms": [],
"description": "TEST"
}

From the error message it looks like you installed the type declarations for graphql-js. The npm link is here.
Type declaration link here.
Neither the type declarations nor the library seems to be present in the package.json.
If this is the library you intend to use,you need to install using --save option as below:
npm install --save graphql
And types with save-dev option to add to dev dependencies.
npm install --save-dev #types/graphql

add "esnext.asynciterable" lib to file tsconfig.json
"compilerOptions": {
"lib": [
. . .
"esnext.asynciterable"
. . .
],
. . .

Related

Storybook - Ember.js - Getting stuck on loading state

I've installed storybook/ember on an existing Ember project, but unfortunatelly it stuck on loading screen with no error - doesn't display the welcome page and shows the spinner instead.
.storybook/main.js
module.exports = {
"stories": [
"../stories/**/*.stories.mdx",
"../stories/**/*.stories.#(js|jsx|ts|tsx)"
],
"addons": [
"#storybook/addon-links",
"#storybook/addon-essentials"
]
}
I haven't touched anything in the stories or .storybook (everythins is the default).
package.json
{
"name": "web-ui",
"version": "0.0.0",
"description": "Small description for web-ui goes here",
"repository": "",
"license": "MIT",
"author": "",
"directories": {
"doc": "doc",
"test": "tests"
},
"private": true,
"scripts": {
"build": "ember build",
"lint:hbs": "ember-template-lint .",
"lint:js": "eslint .",
"start": "ember serve",
"test": "ember test -r xunit",
"coverage": "COVERAGE=true ./node_modules/.bin/ember test --silent",
"storybook": "start-storybook -p 6006 -s dist",
"build-storybook": "build-storybook -s dist"
},
"engines": {
"node": ">= 10.*"
},
"devDependencies": {
"#babel/core": "7.11.6",
"#ember/jquery": "1.1.0",
"#ember/optional-features": "2.0.0",
"#glimmer/component": "1.0.1",
"#storybook/addon-actions": "^6.0.22",
"#storybook/addon-essentials": "^6.0.22",
"#storybook/addon-links": "^6.0.22",
"#storybook/ember": "^6.0.22",
"acorn": "^8.0.1",
"babel-eslint": "10.1.0",
"babel-loader": "^8.1.0",
"babel-plugin-ember-modules-api-polyfill": "^3.1.1",
"babel-plugin-htmlbars-inline-precompile": "^4.2.0",
"bootstrap": "3.4.1",
"broccoli-asset-rev": "3.0.0",
"broccoli-funnel": "3.0.3",
"broccoli-merge-trees": "4.2.0",
"browser": "0.2.6",
"d3": "6.1.1",
"ember-ajax": "5.0.0",
"ember-auto-import": "1.6.0",
"ember-can": "3.0.0",
"ember-cli": "3.16.0",
"ember-cli-app-version": "3.2.0",
"ember-cli-babel": "7.22.1",
"ember-cli-code-coverage": "1.0.0",
"ember-cli-content-security-policy": "1.1.1",
"ember-cli-dependency-checker": "3.2.0",
"ember-cli-document-title-northm": "1.0.3",
"ember-cli-htmlbars": "5.3.1",
"ember-cli-inject-live-reload": "2.0.2",
"ember-cli-json-module": "1.0.0",
"ember-cli-jstree": "1.0.12",
"ember-cli-less": "3.0.1",
"ember-cli-mirage": "1.1.8",
"ember-cli-nouislider": "1.2.1",
"ember-cli-pagination": "3.1.5",
"ember-cli-sri": "2.1.1",
"ember-cli-template-lint": "1.0.0-beta.3",
"ember-cli-test-loader": "3.0.0",
"ember-cli-uglify": "3.0.0",
"ember-data": "3.16.0",
"ember-diff-attrs": "0.2.2",
"ember-disable-proxy-controllers": "1.0.2",
"ember-export-application-global": "2.0.1",
"ember-flatpickr": "2.16.2",
"ember-infinity": "2.1.2",
"ember-inflector": "3.0.1",
"ember-inline-svg": "1.0.0",
"ember-intl": "5.4.2",
"ember-load-initializers": "2.1.1",
"ember-math-helpers": "2.15.0",
"ember-maybe-import-regenerator": "0.1.6",
"ember-power-select": "3.0.4",
"ember-qunit": "4.6.0",
"ember-radio-button": "2.0.1",
"ember-resolver": "7.0.0",
"ember-simple-auth": "2.1.1",
"ember-source": "3.16.0",
"ember-storage": "2.0.0",
"ember-table": "2.2.3",
"ember-template-lint": "1.13.2",
"ember-tooltips": "3.4.5",
"ember-truth-helpers": "2.1.0",
"ember-vega": "1.1.5",
"emberx-select": "3.1.1",
"eslint": "5.16.0",
"eslint-plugin-ember": "7.7.2",
"eslint-plugin-node": "11.1.0",
"jquery-mockjax": "2.6.0",
"jshint": "2.12.0",
"json-merger": "1.1.2",
"loader.js": "4.7.0",
"material-design-icons-iconfont": "4.0.5",
"minimatch": "3.0.4",
"node-gyp": "6.0.0",
"qunit-dom": "1.5.0",
"react-is": "^16.13.1",
"request": "2.88.2",
"rsvp": "4.8.5",
"valid-url": "1.0.9",
"vega-lib": "4.4.0",
"yaml-lint": "1.2.4"
},
"dependencies": {
"#ember/test-helpers": "^1.7.2",
"#storybook/core": "^6.0.22",
"core-js": "^3.6.5",
"faker": "^4.1.0",
"global": "^4.4.0",
"regenerator-runtime": "^0.13.7",
"semver": "^6.3.0",
"ts-dedent": "^2.0.0"
}
}
Any help/suggestions are appreciated.
You need to make sure to run ember install #storybook/ember-cli-storybook after running npx sb init, this will make sure that the ember adapter is installed.
Once you've made thoses steps, make sure to first run your ember app (ie ember s nor ember build) then once the app is built, you can run storybook as you've done.
This is due to a limitation because today the install steps are a bit broken and need to be fixed, that's why we need to run thoses extra steps!
Let me know if you got any questions :)

Ionic unit testing: webpack version

I've been trying to set up a testing example according to the common guidelines: Testing in Ionic, Ionic GitHub Example
My project's package.json:
{
"name": "starter-with-testing",
"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"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",
"test": "karma start ./test-config/karma.conf.js"
},
"dependencies": {
"#angular/animations": "5.2.11",
"#angular/common": "5.2.11",
"#angular/compiler": "5.2.11",
"#angular/compiler-cli": "5.2.11",
"#angular/core": "5.2.11",
"#angular/forms": "5.2.11",
"#angular/http": "5.2.11",
"#angular/platform-browser": "5.2.11",
"#angular/platform-browser-dynamic": "5.2.11",
"#ionic-native/core": "4.7.0",
"#ionic-native/splash-screen": "4.7.0",
"#ionic-native/status-bar": "4.7.0",
"#ionic/storage": "2.1.3",
"ionic-angular": "3.9.2",
"ionicons": "3.0.0",
"rxjs": "5.5.11",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.26"
},
"devDependencies": {
"#ionic/app-scripts": "^3.1.10",
"#types/jasmine": "^2.8.8",
"#types/node": "^10.3.4",
"angular2-template-loader": "^0.6.2",
"html-loader": "^0.5.5",
"istanbul-instrumenter-loader": "^3.0.1",
"jasmine": "^3.1.0",
"jasmine-spec-reporter": "^4.2.1",
"karma": "^2.0.3",
"karma-chrome-launcher": "^2.2.0",
"karma-coverage-istanbul-reporter": "^2.0.1",
"karma-jasmine": "^1.1.2",
"karma-jasmine-html-reporter": "^1.1.0",
"karma-sourcemap-loader": "^0.3.7",
"karma-webpack": "^3.0.0",
"null-loader": "^0.1.1",
"protractor": "^5.3.2",
"ts-loader": "^4.4.1",
"ts-node": "^6.1.2",
"typescript": "~2.6.2"
},
"description": "An Ionic project"
}
Attempt at $ npm test results in an error:
Chrome 67.0.3396 (Linux 0.0.0) ERROR
{
"message": "An error was thrown in afterAll\nUncaught Error: Module build failed: Error: You may be using an old version of webpack; please check you're using at least version 4\n at successfulTypeScriptInstance (/home/alexey/spaces/cordova/starter-with-testing/node_modules/ts-loader/dist/instances.js:168:15)\n at Object.getTypeScriptInstance (/home/alexey/spaces/cordova/starter-with-testing/node_modules/ts-loader/dist/instances.js:51:12)\n at Object.loader (/home/alexey/spaces/cordova/starter-with-testing/node_modules/ts-loader/dist/index.js:16:41)"
That is, webpack 4.x required. Indeed,
$ npm list webpack
starter-with-testing#0.0.1 /home/alexey/spaces/cordova/starter-with-
testing
└─┬ #ionic/app-scripts#3.1.10
└── webpack#3.8.1
What am I supposed to do?
UPD:
I've got It looks like your post is mostly code; please add some more details. fatal error. Your question couldn't be submitted.
I'm really at a loss about more details. There is a dependency hell; please, help. I'll humbly submit whatever additional details you ask.
I had the same problem, and fixed it by downgrading my ts-loader and ts-node to the versions used in the ionic-unit-testing-example repository.
I.e. in package.json:
{
//...
"devDependencies": {
//...
"ts-loader": "^3.0.3",
"ts-node": "^3.0.2",
//...
}
//...
}
It's ts-loader that's complaining, so I'm not sure if the ts-node downgrade is actually required.
I solved the same error by simply give npm i webpack#latest.
I didn't have any custom configuration made so it seems to work now. I just found it takes really long time to compile but I haven't looked at it.

Ionic2 code changes do not get reflected in the live app

I have setup a new Ionic2 project using the Ionic CLI. I used ionic serve command to browse the website. Whenever I make changes to the html templates, I can see the linting and building process kick off, but the html or typescript changes are not reflected in the browser. I have tried several things such as clearing browser cache, using Chrome Incognito, and even killing the ionic session, and re-issuing the ionic serve command. Only after several hours, I see the code changes reflected in the browser. This is extremely frustrating...Please suggest a workaround. I am on Windows 10, Node version 6.9.4, ionic version 2.2.1
Package.json is:
{
"name": "ionic-hello-world",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve"
},
"dependencies": {
"#angular/common": "2.2.1",
"#angular/compiler": "2.2.1",
"#angular/compiler-cli": "2.2.1",
"#angular/core": "2.2.1",
"#angular/forms": "2.2.1",
"#angular/http": "2.2.1",
"#angular/platform-browser": "2.2.1",
"#angular/platform-browser-dynamic": "2.2.1",
"#angular/platform-server": "2.2.1",
"#ionic/storage": "1.1.7",
"angularfire2": "^2.0.0-beta.7",
"firebase": "^3.6.9",
"ionic-angular": "2.0.1",
"ionic-native": "2.4.1",
"ionicons": "3.0.0",
"rxjs": "5.0.0-beta.12",
"sw-toolbox": "3.4.0",
"zone.js": "0.6.26"
},
"devDependencies": {
"#ionic/app-scripts": "^1.0.1",
"#types/request": "0.0.39",
"typescript": "2.0.9"
},
"cordovaPlugins": [
"cordova-plugin-whitelist",
"cordova-plugin-statusbar",
"cordova-plugin-console",
"cordova-plugin-device",
"cordova-plugin-splashscreen",
"ionic-plugin-keyboard"
],
"cordovaPlatforms": [],
"description": "webapp: An Ionic project"
}

Access ionic2 API lockSwipes() method

Ionic2 docs list for a specific component some API methods.
For the slider component there is meant to be a lockSwipes() method.
While some of the methods exist, when I call lockSwipes() my typescript compiler tells me it doesn't exist!
I am on the latest version of ionic2 as of 2017 Feb.
Someone said something about modifying the typescript definitions but I don't know if this is something I should/could do myself.
Below is my packages.json
{
"name": "myApp",
"author": "Company!",
"homepage": "http://www.website.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/storage": "^1.1.6",
"ionic-angular": "2.0.0",
"ionic-native": "2.2.3",
"ionicons": "3.0.0",
"moment": "^2.17.1",
"rxjs": "5.0.0-beta.12",
"zone.js": "0.6.26"
},
"devDependencies": {
"#ionic/app-scripts": "0.0.45",
"typescript": "2.0.6"
},
"cordovaPlugins": [
"cordova-plugin-whitelist",
"cordova-plugin-console",
"cordova-plugin-device",
"cordova-plugin-statusbar",
"cordova-plugin-splashscreen",
"ionic-plugin-keyboard"
],
"cordovaPlatforms": [],
"description": "WCGoalsIonic: An Ionic project"
}

travis running my tests against different versions of ember

I have this repo which uses ember 1.11.0.
My bower.json looks like this:
{
"name": "emberx-autosuggest",
"dependencies": {
"ember": "1.11.1",
"ember-cli-shims": "ember-cli/ember-cli-shims#0.0.3",
"ember-cli-test-loader": "ember-cli-test-loader#0.1.3",
"ember-data": "1.0.0-beta.16.1",
"ember-load-initializers": "ember-cli/ember-load-initializers#0.1.4",
"ember-qunit": "0.3.1",
"ember-qunit-notifications": "0.0.7",
"ember-resolver": "~0.1.15",
"jquery": "^1.11.1",
"loader.js": "ember-cli/loader.js#3.2.0",
"qunit": "~1.17.1"
}
}
My tests all pass locally but when I push to github, travis appears to be running my tests against ember 1.10.0, 1.11.0 and 1.12.0-beta.1.
I only want to run against 1.11.0, how can I configure travis to do this?
My travis.yml looks like this:
---
language: node_js
node_js:
- "0.12"
sudo: false
cache:
directories:
- node_modules
before_install:
- "npm config set spin false"
- "npm install -g npm#^2"
install:
- npm install -g bower
- npm install
- bower install
script:
- npm test
My package.json looks like this:
{
"name": "emberx-autosuggest",
"version": "0.0.1",
"description": "Tag picker functionality",
"directories": {
"doc": "doc",
"test": "tests"
},
"scripts": {
"start": "ember server",
"build": "ember build",
"test": "ember try:testall"
},
"repository": "https://github.com/dagda1/emberx-autosuggest.git",
"engines": {
"node": ">= 0.10.0"
},
"author": "",
"license": "MIT",
"devDependencies": {
"broccoli-asset-rev": "^2.0.2",
"ember-cli": "0.2.3",
"ember-cli-app-version": "0.3.3",
"ember-cli-content-security-policy": "0.4.0",
"ember-cli-dependency-checker": "0.0.8",
"ember-cli-ic-ajax": "0.1.1",
"ember-cli-inject-live-reload": "^1.3.0",
"ember-cli-qunit": "0.3.10",
"ember-cli-uglify": "1.0.1",
"ember-data": "1.0.0-beta.16.1",
"ember-export-application-global": "^1.0.2",
"ember-disable-prototype-extensions": "^1.0.0",
"ember-try": "0.0.4"
},
"keywords": [
"ember-addon"
],
"dependencies": {
"ember-cli-htmlbars": "0.7.4",
"ember-cli-babel": "^5.0.0"
},
"ember-addon": {
"configPath": "tests/dummy/config"
}
}
Uninstall ember-try, or edit config/ember-try.js to test only the versions of ember you would like.