VS Code Typescript intellisense does not read correctly Typings - visual-studio-code

I have installed in my Ionic 3 project pdfjs-dist from npm and the typings from DT, but I do not get the correct intellisense, look: http://imgur.com/ctIqkE7
VS Code: 1.12.2
Typescript: 2.3.3
In my typings folder I have:
Typings
Globals
pdf
index.d.ts
My tsconfig.json says:
{
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"declaration": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [
"dom",
"es2015"
],
"module": "es2015",
"moduleResolution": "node",
"sourceMap": true,
"target": "es5",
"allowJs": true
},
"include": [
"src/**/*.ts"
],
"exclude": [
"node_modules"
],
"compileOnSave": false,
"atom": {
"rewriteTsconfig": false
}
}
and my dependencies are:
"dependencies": {
"#angular/common": "4.1.2",
"#angular/compiler": "4.1.2",
"#angular/compiler-cli": "4.1.2",
"#angular/core": "4.1.2",
"#angular/forms": "4.1.2",
"#angular/http": "4.1.2",
"#angular/platform-browser": "4.1.2",
"#angular/platform-browser-dynamic": "4.1.2",
"#ionic-native/core": "3.10.2",
"#ionic-native/splash-screen": "3.10.2",
"#ionic-native/status-bar": "3.10.2",
"#ionic/storage": "2.0.1",
"#types/pdf": "0.0.31",
"cordova-android": "^6.2.3",
"cordova-ios": "^4.4.0",
"cordova-plugin-console": "^1.0.5",
"cordova-plugin-device": "^1.1.4",
"cordova-plugin-splashscreen": "^4.0.3",
"cordova-plugin-statusbar": "^2.2.2",
"cordova-plugin-whitelist": "^1.3.1",
"ionic-angular": "3.3.0",
"ionic-plugin-keyboard": "^2.2.1",
"ionicons": "3.0.0",
"pdfjs-dist": "^1.8.428",
"rxjs": "5.1.1",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.11"
},
"devDependencies": {
"#ionic/app-scripts": "1.3.7",
"#ionic/cli-plugin-cordova": "1.3.0",
"#ionic/cli-plugin-ionic-angular": "1.3.0",
"typescript": "2.3.3"
},
I have looked other questions here like this or this and did not find an solution.
Edit:
I had added updated my includes with the path to the dt typings "typings/**/*.d.ts" and I had this warning while compiling:
typescript: node_modules/#types/pdf/index.d.ts, line: 51
Duplicate string index signature.
L51: * A unique ID to identify a PDF. Not guaranteed to be unique. [jbaldwin: haha what]
L52: **/
That point me out that the types are not been reading from typings/** but from node_modules/#types/. I took a look and saw that both index.d.ts files are exactly the same so I uninstalled the typings outside node.
After a while of looking into it I have two main theories about my problem.
1. I do not know what I am doing (Very possible)
2. The Typings are wrong and/or Outdated.
I have found a PDFJSStatic interface that contains the "unintellisensed" method in my screen capture that is exported in the typings. If I do something like:
import * as PDF_JS from 'pdfjs-dist';
let pdfjsLib : PDFJSStatic = PDF_JS;
I finally get Info about the getDocument() method but a lot of other functions get broken.
If I get the PDFJSStatic as an own variable:
var PDFJSStatic : PDFJSStatic = pdfjsLib.PDF;
The intellisense works but obviously the functions does not exist.

Related

Cannot find module '#ionic-native/power-management/ngx'

I installed cordova power management plugin into my ionic application. Following the usage guidance "https://ionicframework.com/docs/native/power-management#installationenter link description here", I import the class as below:
import { PowerManagement } from '#ionic-native/power-management/ngx';
but, when build this ionic app, got the error:
Cannot find module '#ionic-native/power-management/ngx'
Why this error appears? How to fix it?
I try to import the class with removing the ngx module, then error disappears:
import { PowerManagement } from '#ionic-native/power-management';
my package.json file is:
{
"name": "ionicapp",
"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"start": "ionic-app-scripts serve",
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"lint": "ionic-app-scripts lint"
},
"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",
"#angular/router": "^6.1.9",
"#ionic-native/background-geolocation": "^4.16.0",
"#ionic-native/background-mode": "^4.20.0",
"#ionic-native/ble": "^4.12.0",
"#ionic-native/bluetooth-serial": "^4.12.2",
"#ionic-native/camera": "4.3.3",
"#ionic-native/core": "^4.12.2",
"#ionic-native/geolocation": "^4.12.0",
"#ionic-native/google-maps": "^4.12.0",
"#ionic-native/launch-navigator": "^4.15.0",
"#ionic-native/native-storage": "^4.12.0",
"#ionic-native/network": "^4.12.2",
"#ionic-native/network-interface": "^4.12.2",
"#ionic-native/power-management": "^4.20.0",
"#ionic-native/splash-screen": "~4.11.0",
"#ionic-native/sqlite": "^4.12.2",
"#ionic-native/status-bar": "^4.11.0",
"#ionic/storage": "^2.1.3",
"#ngx-translate/core": "8.0.0",
"#ngx-translate/http-loader": "^2.0.0",
"#types/google-maps": "^3.2.0",
"#types/googlemaps": "^3.30.12",
"an": "0.0.8",
"angularfire2": "^5.0.2",
"chart.js": "^2.7.2",
"cordova-android": "7.1.0",
"cordova-plugin-actionsheet": "^2.3.3",
"cordova-plugin-background-mode": "git+https://github.com/tushe/cordova-plugin-background-mode.git",
"cordova-plugin-ble-central": "^1.2.2",
"cordova-plugin-bluetooth-serial": "^0.4.7",
"cordova-plugin-compat": "^1.2.0",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-dialogs": "^2.0.1",
"cordova-plugin-geolocation": "^4.0.1",
"cordova-plugin-googlemaps": "^2.4.2",
"cordova-plugin-ionic-keyboard": "^2.1.2",
"cordova-plugin-ionic-webview": "^2.1.0",
"cordova-plugin-mauron85-background-geolocation": "^3.0.0-alpha.43",
"cordova-plugin-nativestorage": "^2.3.2",
"cordova-plugin-network-information": "^2.0.1",
"cordova-plugin-networkinterface": "^2.0.0",
"cordova-plugin-powermanagement-orig": "^1.1.2",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-statusbar": "^2.4.2",
"cordova-plugin-whitelist": "^1.3.3",
"cordova-sqlite-storage": "^2.4.0",
"firebase": "^5.5.3",
"ionic-angular": "3.9.2",
"ionic-native": "4.1.1",
"ionicons": "3.0.0",
"ng2-charts": "^1.6.0",
"rxjs": "5.5.11",
"sw-toolbox": "3.6.0",
"uk.co.workingedge.phonegap.plugin.launchnavigator": "^4.2.2",
"zone.js": "0.8.26",
"at.gofg.sportscomputer.powermanagement": "~1.1.2"
},
"devDependencies": {
"#ionic/app-scripts": "^3.2.0",
"#mauron85/cordova-plugin-background-geolocation": "^3.0.0-alpha.4",
"typescript": "~2.6.2"
},
"description": "An Ionic project",
"cordova": {
"plugins": {
"cordova-plugin-ble-central": {},
"cordova-plugin-whitelist": {},
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-ionic-webview": {},
"cordova-plugin-ionic-keyboard": {},
"cordova-plugin-geolocation": {
"GEOLOCATION_USAGE_DESCRIPTION": "To locate you"
},
"cordova-plugin-mauron85-background-geolocation": {
"GOOGLE_PLAY_SERVICES_VERSION": "11+",
"ANDROID_SUPPORT_LIBRARY_VERSION": "23+",
"ALWAYS_USAGE_DESCRIPTION": "App requires background tracking enabled",
"MOTION_USAGE_DESCRIPTION": "App requires motion detection"
},
"cordova-plugin-nativestorage": {},
"cordova-sqlite-storage": {},
"cordova-plugin-statusbar": {},
"cordova-plugin-bluetooth-serial": {},
"cordova-plugin-network-information": {},
"cordova-plugin-networkinterface": {},
"uk.co.workingedge.phonegap.plugin.launchnavigator": {
"OKHTTP_VERSION": "3.+"
},
"cordova-plugin-background-mode": {},
"at.gofg.sportscomputer.powermanagement": {}
},
"platforms": [
"android"
]
}
}
Use ngx if your Angular version is >=6
You seem to be using the wrong plugin version. Correct your error by following the steps mentioned below
Check your project type in ionic.config.json file.
If the type is "ionic-angular", then install 4 version.
ionic cordova plugin add cordova-plugin-powermanagement-orig
npm install #ionic-native/power-management#4
If the type is "angular", then install the latest version
ionic cordova plugin add cordova-plugin-powermanagement-orig
npm install #ionic-native/power-management
Note:
Add ngx at the end of import only if you are using Angular 6 or 6+
import { PowerManagement } from '#ionic-native/power-management/ngx';
if not remove ngx from the import both in app.module.ts and app.component.ts
import { PowerManagement } from '#ionic-native/power-management';
Refencence:https://github.com/ionic-team/ionic/issues/15225#issuecomment-414074074

Ionic: package.json missing start script

My package.json doesn't have a start script, so npm start will not work.
My package.json looks like
{
"name": "ionic-hello-world",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"build": "ionic-app-scripts build",
"watch": "ionic-app-scripts watch",
"serve:before": "watch",
"emulate:before": "build",
"deploy:before": "build",
"build:before": "build",
"run:before": "build"
},
"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",
"#agm/core": "1.0.0-beta.0",
"es6-promise": "3.0.2",
"es6-shim": "^0.35.0",
"ionic-angular": "2.0.0",
"ionic-native": "^2.2.14",
"ionicons": "3.0.0",
"ng2-cordova-oauth": "0.0.6",
"rxjs": "5.0.0-beta.12",
"sw-toolbox": "3.4.0",
"zone.js": "0.6.26"
},
"devDependencies": {
"#ionic/app-scripts": "1.0.0",
"typescript": "2.1.5"
},
"cordovaPlugins": [
"cordova-plugin-device",
"cordova-plugin-console",
"cordova-plugin-whitelist",
"cordova-plugin-splashscreen",
"cordova-plugin-statusbar",
"ionic-plugin-keyboard",
"cordova-plugin-inappbrowser"
],
"cordovaPlatforms": [
"ios",
{
"platform": "ios",
"version": "",
"locator": "ios"
}
],
"description": "third-party-auth-ionic2-tutorial: An Ionic project"
}
What should the start script contain?
From what I have found, Ionic projects do not use a start script in the package.json, so npm start is not needed.
use ionic start to create a new project and ionic serve to run the project during development as described in the Getting Started Guide.
There are other commands to build, deploy and package your project when needed, make sure to check the ionic documentation for how to do these the 'Ionic way'

node_modules/#angular/core/index"' has no exported member 'Version'

I am working on ionic/angular 2 and I just took the new clone of my project and ran npm install.Now when I run the ionic serve, it gives me the following error
typescript:/node_modules/#angular/forms/src/version.d.ts, line: 13
Module '/node_modules/#angular/core/index"' has no exported
member 'Version'.
Here is the ionic info
cli packages: (C:\Users\Admin\AppData\Roaming\npm\node_modules)
#ionic/cli-utils : 1.9.2
ionic (Ionic CLI) : 3.9.2
global packages:
Cordova CLI : 6.5.0
local packages:
#ionic/app-scripts : 1.3.12
Cordova Platforms : none
Ionic Framework : ionic-angular 2.0.0-rc.3
System:
Node : v6.9.1
npm : 3.10.8
OS : Windows 10
and here is my package.json
{
"name": "myApp",
"author": "Zohra",
"homepage": "https://www.example.com/",
"private": true,
"scripts": {
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve"
},
"dependencies": {
"#angular/animations": "^4.2.6",
"#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-native/core": "^3.14.0",
"#ionic-native/splash-screen": "^3.10.3",
"#ionic-native/toast": "^3.14.0",
"#ionic/storage": "1.1.6",
"angular2-localstorage": "^0.4.0",
"angular2-moment": "^1.3.0",
"angularjs-toaster": "^2.1.0",
"chart.js": "^2.5.0",
"cordova-plugin-splashscreen": "~4.0.3",
"cordova-plugin-whitelist": "~1.3.2",
"gulp-browserify": "^0.5.1",
"intl": "^1.2.5",
"ionic-angular": "2.0.0-rc.3",
"ionic-native": "2.2.3",
"ionicons": "3.0.0",
"jquery": "^3.1.1",
"moment": "^2.17.1",
"ng2-webstorage": "^1.4.1",
"rxjs": "^5.0.1",
"zone.js": "0.6.26"
},
"devDependencies": {
"#ionic/app-scripts": "^1.2.2",
"#ionic/cli-plugin-cordova": "^1.0.0-rc.2",
"#ionic/cli-plugin-gulp": "1.0.2",
"#ionic/cli-plugin-ionic-angular": "1.3.2",
"typescript": "2.0.6"
},
"cordovaPlugins": [
"cordova-plugin-whitelist",
"cordova-plugin-console",
"cordova-plugin-statusbar",
"cordova-plugin-device",
"cordova-plugin-splashscreen",
"ionic-plugin-keyboard",
"de.appplant.cordova.plugin.local-notification",
"cordova-plugin-app-event"
],
"cordovaPlatforms": [
"android"
],
"description": "Ionic App",
"config": {
"ionic_source_map": "source-map"
},
"cordova": {
"plugins": {
"cordova-plugin-splashscreen": {},
"cordova-plugin-whitelist": {}
}
}
}
Please help me

Runtime Error Cannot read property '_getPortal' of undefined

I have a simple ion-select component in my html file like this:
<ion-row><ion-item class="login-item">
<ion-label floating> Companies</ion-label>
<ion-select [(ngModel)]="storeid">
<ion-option value="1"> store1</ion-option>
<ion-option value="2"> store2</ion-option>
</ion-select>
</ion-item></ion-row>
And My package.json is like this:
{
"name": "ionic-hello-world",
"version": "0.0.0",
"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": "4.0.2",
"#angular/compiler": "4.0.2",
"#angular/compiler-cli": "4.0.2",
"#angular/core": "4.0.2",
"#angular/forms": "4.0.2",
"#angular/http": "4.0.2",
"#angular/platform-browser": "4.0.2",
"#angular/platform-browser-dynamic": "4.0.2",
"#ionic-native/core": "3.4.2",
"#ionic-native/splash-screen": "3.4.2",
"#ionic-native/status-bar": "3.4.2",
"#ionic/storage": "2.0.1",
"angular2-swing": "^0.7.1",
"ionic-angular": "3.2.1",
"ionic2-auto-complete": "^1.4.2-release",
"ionic2-super-tabs": "^2.3.0",
"ionicons": "3.0.0",
"ng2-swipe-cards": "^1.0.14",
"rxjs": "5.1.1",
"sw-toolbox": "3.4.0",
"zone.js": "^0.8.5"
},
"devDependencies": {
"#ionic/app-scripts": "1.3.6",
"typescript": "~2.2.1"
},
"cordovaPlugins": [
"cordova-plugin-whitelist",
"cordova-plugin-console",
"cordova-plugin-statusbar",
"cordova-plugin-device",
"ionic-plugin-keyboard",
"cordova-plugin-splashscreen"
],
"cordovaPlatforms": [],
"description": "An Ionic project"
}
When i click to the select in the view it crashes and runtime error stack is as below:
TypeError: Cannot read property '_getPortal' of undefined
at App.present (http://localhost:8100/build/main.js:17984:52)
at Alert.present (http://localhost:8100/build/main.js:49299:26)
at Select.open (http://localhost:8100/build/main.js:71893:17)
at Select._click (http://localhost:8100/build/main.js:71758:14)
at Object.eval [as handleEvent] (ng:///AboutModule/About.ngfactory.js:433:43)
at handleEvent (http://localhost:8100/build/main.js:12303:138)
at callWithDebugContext (http://localhost:8100/build/main.js:13511:42)
at Object.debugHandleEvent [as handleEvent] (http://localhost:8100/build/main.js:13099:12)
at dispatchEvent (http://localhost:8100/build/main.js:9278:21)
at http://localhost:8100/build/main.js:9868:38
Everything is so simple and I dont understand what can be the problem.
I had the same error message in my app. The error was created from custom component module file: components.module.ts.
I added this import entry IonicModule.forRoot(MyCustomComponent).
After this, no way to make alert, loading, etc working.
Solution was to remove .forRoot(MyCustomComponent)
Hope this will help some guys around

Cannot find namespace 'moment'

I am using ionic 2.
I create new project
ionic start Ismart --v2
The project was successfully created.
I tried to run the project using ionic serve
I am getting this err
Cannot find namespace 'moment'
Here is my Package.Json
{
"name": "ionic-hello-world",
"version": "0.0.0",
"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": "4.0.2",
"#angular/compiler": "4.0.2",
"#angular/compiler-cli": "4.0.2",
"#angular/core": "4.0.2",
"#angular/forms": "4.0.2",
"#angular/http": "4.0.2",
"#angular/platform-browser": "4.0.2",
"#angular/platform-browser-dynamic": "4.0.2",
"#ionic-native/core": "3.4.2",
"#ionic-native/splash-screen": "3.4.2",
"#ionic-native/status-bar": "3.4.2",
"#ionic/storage": "2.0.1",
"ionic-angular": "3.1.0",
"ionicons": "3.0.0",
"rxjs": "5.1.1",
"sw-toolbox": "3.4.0",
"zone.js": "^0.8.5"
},
"devDependencies": {
"#ionic/app-scripts": "1.3.6",
"typescript": "~2.2.1"
},
"cordovaPlugins": [
"cordova-plugin-whitelist",
"cordova-plugin-console",
"cordova-plugin-statusbar",
"cordova-plugin-device",
"cordova-plugin-splashscreen",
"ionic-plugin-keyboard"
],
"cordovaPlatforms": [],
"description": "ISmartpremises: An Ionic project"
}
How can i fix this issue...
Kindly advice me,
Thanks
I cannot see any issue in your package.json file.I think you have forgotten to change the directory.
You can try as shown below.
d:\ionic2 > ionic start Ismart blank --v2
d:\ionic2\Ismart> ionic serve