我在理解如何从TypeScript中的模块导入类时遇到一些麻烦,特别是对于使用TypeScript 1.7的Visual Studio 2015(更新1)中的Angular 2.
在Angular 2文档中,我看到了导入语句,例如:
import {Component} from 'angular2/core';.这些文件在node_modules/angular2/*.什么使得angular2/*工作?
当我从app目录获得相对路径时,我只能摆脱Visual Studio中的错误,如:./../node_modules/angular2/platform/browser';.这修复了Visual Studio构建错误,但是当我尝试运行应用程序时,System.import('app/boot')我得到了一堆这样的错误:
system.src.js:1049 GET http:// localhost:8080/node_modules/angular2/platform/browser 404(Not Found)
另一个问题是能够import {SearchComponent} from './Components/Search/search.component';在Visual Studio中使用如下语句:但是当我运行它时,会出现很多GET错误system.src.js:2476.
我认为设置defaultExtension: 'js'for System.config应该已经解决了这个问题.
更新 以下是我认为相关的所有文件:
意见/家庭/ index.html的
<script src="node_modules/es6-shim/es6-shim.js"></script>
<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
System.config({
packages: {
app: {
format: 'register',
defaultExtension: 'js'
}
}
});
System.import('app/app')
.then(null, console.error.bind(console));
Run Code Online (Sandbox Code Playgroud)
test.csproj
<TypeScriptToolsVersion>1.7</TypeScriptToolsVersion>
<TypeScriptExperimentalDecorators>True</TypeScriptExperimentalDecorators>
<TypeScriptModuleResolution>Node</TypeScriptModuleResolution>
<TypeScriptTarget>ES5</TypeScriptTarget>
<TypeScriptJSXEmit>None</TypeScriptJSXEmit>
<TypeScriptCompileOnSaveEnabled>True</TypeScriptCompileOnSaveEnabled> …Run Code Online (Sandbox Code Playgroud) 我为Angular 2 alpha 45构建了一个应用程序,它工作得非常好,但是为了让它工作,我不得不"乱七八糟".我理解Angular 2,但我不明白如何让它开始实际使用Angular 2.
我正在尝试清晰构建'Angular 2:5 min Quickstart'.有很多问题,我将尽可能具体.我想了解为什么这些问题正在发生,并希望如何解决它们.Visual Studio 2015 Update 1,Typescript 1.7.
打字稿配置:快速入门包括tsconfig.json文件.
{
"compilerOptions": {
"target": "es5",
"module": "system",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false
},
"exclude": [
"node_modules"
]
}
Run Code Online (Sandbox Code Playgroud)
我不确定这是否有效,因为我必须编辑ProjectName.csproj文件并添加行:
<TypeScriptExperimentalDecorators>True</TypeScriptExperimentalDecorators>
以摆脱实验装饰器错误.
https://github.com/Microsoft/TypeScript/issues/3124似乎建议tsconfig文件需要在/ Scripts中工作,但这对我也不起作用.
我想知道如何使这个tsconfig文件工作,或编辑.csproj文件以获得相同的编译器选项.如果查看Project Properties> Typescript Build.这些重要吗?模块系统应该是:系统?
我的文件结构与Quickstart相同.
app/
app.component.ts
boot.ts
node_modules/
blah
index.html
tsconfig.json
package.json
Run Code Online (Sandbox Code Playgroud)
我使用powershell运行npm install来获取node_modules目录中的所有内容.
import {Component} from 'angular2/core';显示错误.../node_modules/angular2/core';不会显示错误,但是当您构建项目时,会在文件中出现大量构建错误node_moduels/angular2/src/*.现在,我可能会进入并手动修复这些问题,但我觉得如果出现这些错误,配置是错误的.tsconfig似乎想要排除node_modules.为什么我无法使用'angular2/core'而必须使用它的相对路径?如果我在Visual Studio项目中包含node_modules,则会出现大量的构建错误node_modules.另外:我正在做这个干净的构建,因为我无法弄清楚如何将项目从alpha …