angular – 如何在Visual Studio 2015中从非相对路径导入模块

我正在Visual Studio 2015中使用gulp进行角度4项目.
我从 here获得了Visual Studio 2015 QuickStart.

> tsc版本：2.5.2

我的项目结构：

src
└──angular
     └──common
           └──models
                └──items.ts
     └──ui
         └──components
                └──items.component.ts

items.ts

export module items {
  export const listOfItems = [1,2,3];
}

我想在导入我的src文件夹中的所有内容时使用非相对路径,即：

items.component.ts

import { items } from 'items';

这是我的tsconfig.json文件(与src处于同一级别)：

{
  "compileOnSave": false,"compilerOptions": {
    "target": "es5","module": "commonjs","moduleResolution": "node","sourceMap": true,"emitDecoratorMetadata": true,"experimentalDecorators": true,"lib": [ "es2015","dom" ],"noImplicitAny": true,"suppressImplicitAnyIndexErrors": true,"typeRoots": [
      "node_modules/@types/"
    ]
  }
}

在这里,我尝试将其添加到compilerOptions中：

"baseUrl": "." //it doesn't help.

之后：

"baseUrl": ".","paths": {
      "*": [
        "*","src/agnular/*" // still nothing.
      ]
}

我还添加了rootDirs,但我仍然收到此错误：

Cannot find module 'items'

首先,确保你已经安装了 TypeScript for Visual Studio 2015 – v2.5.2,之后：

tsconfig.json：

{
  "compileOnSave": false,"compilerOptions": {
    "baseUrl": "./src","paths": {
     "@models/*": [ "angular/common/models/*" ]
     }
    //..
  }
}

用法：

import { items } from '@models/items';

那么,这里发生了什么：

*指向我们文件的实际名称,因此在我们的情况下,在@models之后有*指向项目,而项目在angular / common / models / *内.

另外,我们应该将它添加到systemjs.config.js中,以便可以解析路径：

System.config({
    paths: {
      // paths serve as alias
      'npm:': 'node_modules/',"@models/*": ["rootDist/angular/common/models/*"]
                        ^
                        where you keep your files,for example dist/
    }
    // other things..
  });

另一个重要的事情是重新启动视觉工作室

我也试过卸载/重新加载项目,但这没有用.

angular – 如何在Visual Studio 2015中从非相对路径导入模块

猜你在找的Angularjs相关文章