我正在尝试建立一个联系人应用程序,使用Apache Cordova插件的联系人。当尝试做一个npm run bundle
命令我的应用程序,它给我上面的标题错误。我该如何解决这个问题?
我试过将我的package.json
中的依赖项更新到不同的版本,我也试过摆脱我的tsconfig.webpack.json
中的"module": "commonjs"
,但没有成功。
===========
// index.ts
===========
export class CordovaApp{
constructor(){
document.getElementById('findContactButton').addEventListener('click', this.onfindContactButtonClick);
}
onfindContactButtonClick(){
const searchText = (<HTMLInputElement>document.getElementById('searchText')).value;
let fields = [navigator.contacts.fieldType.displayName, navigator.contacts.fieldType.name];
navigator.contacts.find(fields, (contacts) => {
var ul = document.getElementById('contacts');
contacts.forEach(function (contact) {
var li = document.createElement('li');
li.className = 'collection-item';
li.innerText = contact.displayName;
ul.appendChild(li);
});
}, (error) => {
alert(error);
},
{
filter: searchText, multiple: true,
desiredFields: [navigator.contacts.fieldType.displayName]
});
return false;
}
}
let instance = new CordovaApp()
===========
// index.js
===========
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var CordovaApp = (function () {
function CordovaApp() {
document.getElementById('findContactButton').addEventListener('click', this.onfindContactButtonClick);
}
CordovaApp.prototype.onfindContactButtonClick = function () {
var searchText = document.getElementById('searchText').value;
var fields = [navigator.contacts.fieldType.displayName, navigator.contacts.fieldType.name];
navigator.contacts.find(fields, function (contacts) {
var ul = document.getElementById('contacts');
contacts.forEach(function (contact) {
var li = document.createElement('li');
li.className = 'collection-item';
li.innerText = contact.displayName;
ul.appendChild(li);
});
}, function (error) {
alert(error);
}, {
filter: searchText, multiple: true,
desiredFields: [navigator.contacts.fieldType.displayName]
});
return false;
};
return CordovaApp;
}());
exports.CordovaApp = CordovaApp;
var instance = new CordovaApp();
//# sourceMappingURL=index.js.map
===========
// package.json
===========
"dependencies": {
"cordova-android": "^6.2.3",
"cordova-browser": "^4.1.0",
"cordova-ios": "^4.4.0",
"cordova-plugin-compat": "^1.0.0",
"cordova-plugin-contacts": "^3.0.1",
"cordova-plugin-whitelist": "^1.3.2"
},
"devDependencies": {
"@types/cordova": "^0.0.34",
"@types/cordova-plugin-contacts": "^2.3.0",
"typescript": "^2.4.1",
"webpack": "^1.14.0",
"webpack-dev-server": "^1.16.2",
"ts-loader": "1.3.3",
"html-loader": "0.4.4",
"css-loader": "0.26.1",
"awesome-typescript-loader": "^3.2.1"
}
===========
// Running Command prompt
===========
npm run bundle
[at-loader] Checking started in a separate process...
[at-loader] Checking finished with 4 errors
Hash: 52c5912a7e1b4f149e40
Version: webpack 1.15.0
Time: 1014ms
Asset Size Chunks Chunk Names
./www/dist/bundle.js 7.51 kB 0 [emitted] main
+ 1 hidden modules
ERROR in [at-loader] ./www/js/index.ts:8:33
TS2339: Property 'contacts' does not exist on type 'Navigator'.
ERROR in [at-loader] ./www/js/index.ts:8:75
TS2339: Property 'contacts' does not exist on type 'Navigator'.
ERROR in [at-loader] ./www/js/index.ts:10:19
TS2339: Property 'contacts' does not exist on type 'Navigator'.
ERROR in [at-loader] ./www/js/index.ts:23:39
TS2339: Property 'contacts' does not exist on type 'Navigator'.
代码应该正确绑定,并且应该没有错误。
2条答案
按热度按时间70gysomp1#
我知道这是个老问题,但不管是谁在谷歌上搜索:
在项目的src文件夹中创建一个包含以下内容的
global.d.ts
文件:它将扩展导航器类型并使TS编译器满意:)
bvuwiixz2#
您必须将以下行添加到“files”属性中的src/tsconfig.json:
之后,您必须重新启动正在运行的“ionic serve”命令(或只是重建它)。
src/tsconfig.json文件最后应如下所示:
我希望这对你有帮助。请注意,这是离子4的溶液。离子3或更低可能会有所不同。