Tôi có angular2 làm việc với Visual Studio 2015. Tôi phải cài đặt .NET 5 RC1 để hỗ trợ tsconfig.json. Họ có một cấu trúc dự án hoàn toàn mới mà tôi rất thích. Đây là thiết lập của tôi:
Bạn sẽ nhận thấy rằng tôi đặt thư mục ứng dụng của tôi và các file ts bên trong wwwroot của tôi - đó chỉ là sở thích của tôi, và nó sau QuickStart angular2. Tôi đã sao chép các tệp được gộp từ các mô-đun nút của mình vào thư mục tập lệnh của tôi bên trong wwwroot của mình.
Tôi tạo ra một package.json dựa trên QuickStart angular2 beta:
{
"name": "angular2-quickstart",
"version": "1.0.0",
"license": "ISC",
"dependencies": {
"angular2": "2.0.0-beta.0",
"systemjs": "0.19.6",
"es6-promise": "^3.0.2",
"es6-shim": "^0.33.3",
"reflect-metadata": "0.1.2",
"rxjs": "5.0.0-beta.0",
"zone.js": "0.5.10"
}
}
Sau đó, tôi phải nhấp vào package.json và chọn "Restore gói" và nó chạy NPM cài đặt để tạo ra các node_modules với tất cả các gói bạn thấy. Sau đó, tôi thiết lập tsconfig.json của tôi như vậy và đặt nó vào thư mục gốc:
{
"compilerOptions": {
"target": "es5",
"module": "system",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false
},
"exclude": [
"node_modules"
]
}
Đây là chìa khóa để làm cho nó hoạt động. Tôi thực sự phải tải lại giải pháp cho nó để xem tsconfig.json và bắt đầu sử dụng nó. Thêm vào đó, tôi đã đi vào Công cụ của tôi> Options và thiết lập các tùy chọn nguyên cảo như vậy: 
Tiếp theo, tôi thêm vào tập tin index.html của tôi:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Sample Angular 2 App</title>
</head>
<body>
<my-app>Loading...</my-app>
<script src="scripts/angular2-polyfills.js"></script>
<script src="scripts/system.src.js"></script>
<script src="scripts/Rx.js"></script>
<script src="scripts/angular2.dev.js"></script>
<script>
System.config({
packages: {
app: {
format: 'register',
defaultExtension: 'js'
}
}
});
System.import('app/boot').then(null, console.error.bind(console));
</script>
</body>
</html>
Trình tự kịch bản của bạn bao gồm rất quan trọng ! Dưới đây là MyApp.ts tập tin của tôi:
import { Component } from "angular2/core";
@Component({
selector: "my-app",
template: `
<div>Hello from Angular 2</div>
`
})
export class MyApp {
public constructor() {
}
}
và boot.ts tập tin của tôi:
import { bootstrap } from "angular2/platform/browser";
import { MyApp } from "./MyApp";
bootstrap(MyApp);
Tại thời điểm này tôi cảm thấy mình đã sẵn sàng để chạy nó, vì vậy tôi đưa ra nó và chuyển đến tôi/index .html - nhưng tất cả những gì tôi thấy là "Hello World!". Dường như bỏ qua đường dẫn của tôi để phục vụ index.html và đã viết văn bản tĩnh. Nhìn vào Startup.cs, tôi đã tìm ra vấn đề.:
namespace Angular2Demo
{
public class Startup
{
// This method gets called by the runtime. Use this method to add services to the container.
// For more information on how to configure your application, visit http://go.microsoft.com/fwlink/?LinkID=398940
public void ConfigureServices(IServiceCollection services)
{
}
// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
public void Configure(IApplicationBuilder app)
{
app.UseIISPlatformHandler();
// Add this!
app.UseStaticFiles();
// Remove this!
//app.Run(async (context) =>
//{
// await context.Response.WriteAsync("Hello World!");
//});
}
// Entry point for the application.
public static void Main(string[] args) => WebApplication.Run<Startup>(args);
}
}
By ý kiến ra app.Run và thêm các app.UseStaticFiles(); (mà cần cài đặt một gói bổ sung), tôi đã sẵn sàng để thử lại:
thành công!
Tôi đang gặp sự cố với câu hỏi của mình cho VS 2013: http://stackoverflow.com/questions/34366928/how-can-i-setup-my-vs-2013-typescript-project-to- biên dịch-my-typescript-files-nhưng Tôi nhớ tự mình gặp vấn đề này khi tôi đang làm việc với nó trong Intellij. Giải pháp đã tự giải quyết khi tôi sử dụng TS 1.6 và Loại trừ trong tsconfig.json của tôi. – Zach
Tôi đang sử dụng 1.7.3 và vấn đề không phải với nút-mô-đun, đó là với TS mà tôi đã viết (từ hướng dẫn angualr2). Tôi không nghĩ rằng tôi cần phải loại trừ điều này, nó cần phải biên dịch. –
vâng, tôi đã cố gắng để làm việc với góc nhìn 2 với studio trực quan, nhưng sau hành vi kỳ lạ và nhiều lỗi "boolean sh * t" và 8 giờ cố gắng giải quyết tôi chỉ cần dời dự án của tôi ... –