Angular2 - 如何为我的测试项目导入自定义组件?

时间:2016-09-16 03:48:30

标签: javascript angularjs angular components custom-component

我使用Angular 2创建了一个测试组件,并在npm中发布。现在我正在尝试在Angular 2项目中重用此组件。

我在npm中创建和发布的组件是zpt-input。

运行npm start时尝试以下错误:

error TS2307: Cannot find module './zpt-input'.

我正在使用6.4.0版本的Node.js

我的 systemjs.config.js

var map = {
    'app':                        'app', // 'dist',

    '@angular':                   'node_modules/@angular',
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
    'rxjs':                       'node_modules/rxjs',
    'zpt-input':                  'node_modules/zpt-input'
  };

  var packages = {
    'app':                        { main: 'main.js',  defaultExtension: 'js' },
    'rxjs':                       { defaultExtension: 'js' },
    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },
    'zpt-input':                  { main: 'zpt-input.js', defaultJSExtensions: true}
  };

我已尝试以多种方式导入:

import { ZptInputComponent } from './zpt-input'; 
import { ZptInputComponent } from 'zpt-input';

我的 package.json

"dependencies": {
"@angular/common":  "2.0.0-rc.4",
"@angular/compiler":  "2.0.0-rc.4",
"@angular/core":  "2.0.0-rc.4",
"@angular/forms": "0.2.0",
"@angular/http":  "2.0.0-rc.4",
"@angular/platform-browser":  "2.0.0-rc.4",
"@angular/platform-browser-dynamic":  "2.0.0-rc.4",
"@angular/router":  "3.0.0-beta.2",
"@angular/router-deprecated":  "2.0.0-rc.2",
"@angular/upgrade":  "2.0.0-rc.4",

"systemjs": "0.19.27",
"core-js": "^2.4.0",
"reflect-metadata": "^0.1.3",
"rxjs": "5.0.0-beta.6",
"zone.js": "^0.6.12",

"angular2-in-memory-web-api": "0.0.14",
"bootstrap": "^3.3.6",
"zpt-input": "^0.0.5"

我需要更多配置吗?感谢

0 个答案:

没有答案