mck*_*imo 6 javascript typing npm typescript angular
我在如何使用时刻-js-library-in-angular-2-typescript-app中采用的方法非常接近,但仍然得到error TS2307: Cannot find module 'mqtt'.
npm install --save mqtt
<s>typings install --save mqtt</s
没有找到打字但这确实......
typings install mqtt --save --ambient
我的tsconfig.conf看起来像这样
{
"compilerOptions": {
"noImplicitAny": true,
"module": "commonjs",
"target": "ES5",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"sourceMap": true,
"declaration": true
},
"files": [
"ng2-mqtt.ts"
],
"exclude": [
"node_modules"
]
}
而ng2-mqtt.ts只是有这个...
export * from './src/mqtt.service'
并./src/mqtt.service.ts有..
import {Injectable} from 'angular2/core';
import * as mqtt from 'mqtt';
@Injectable()
export class MqttService {
constructor() {
//mqtt.connect('ws://10.0.1.100:3333')
// ...
}
}
tsc -version 1.8.10,angular2 @2.0.0-beta.17,typings 0.8.1,npm 2.14.20,node v4.4.1,Windows 7
将Angular 2与其打字的世界之外的元素一起使用会不会太难？
我做了以下工作来让我的工作：
1）首先通过依赖项中的package.json安装ng2-mqtt并运行npm更新，以便将其包含在node_modules中
2）在你的index.html中，一定要包含它：
<html>
<head>
<title>whatever</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.css">
<script>document.write('<base href="' + document.location + '" />');</script>
<script src="node_modules/ng2-mqtt/mqttws31.js" type="text/javascript"></script>
3) 添加 mqtts 映射，如下所示到 systemjs.config.js（参见映射）：
System.config({
transpiler: 'typescript',
typescriptOptions: {emitDecoratorMetadata: true},
map: {
'@angular': 'node_modules/@angular',
'mqttws31': 'node_modules/ng2-mqtt/mqttws31.js'
},
4）像平常一样导入：
import {Paho} from 'mqttws31'
5）在你的@Component中使用它：
this.client = new Paho.MQTT.Client("localhost", Number(61614), "myclientid_");
this.client.onConnectionLost = (responseObject: Object) => {
console.log('Connection lost.');
this.connected ="false";
};
this.client.onMessageArrived = (message: Paho.MQTT.Message) => {
console.log('Message arrived.');
this.msg =message.payloadString;
};
this.client.connect({ onSuccess: this.onConnected.bind(this); });
如果一切顺利，您应该会看到您的连接（假设是 activemq）： img
使用方法请参考这里： https: //github.com/icanos/ng2-mqtt
| 归档时间： |
|
| 查看次数： |
8357 次 |
| 最近记录： |
