I have started a new ASP.NET5/MVC6 project.
Attempt 1 My problem is that when I set moduleResolution
to classic
in tsconfig.json
i receive an error as follows:
Cannot find module 'angular2/core'
Attempt 2 If I change tsconfig.json
to use node
resolution, the exclude node_modules
in tsconfig.js
does not work, this is a bug? , which is closed, though it still seems to be a problem, and multiple errors are encountered when studio 2015 trolls through the node_modules
folder including every .d.ts
in the entire tree. There are hundreds of errors, mostly in rxjs
.
Attempt 3 If I remove tsconfig.json
completely, I can get the application executing, and the files compiled, but alas, this error in the browser.
Error: (SystemJS) require is not defined
I cannot help but think that the angular2 / typescript support in Visual Studio is a complete mess , and I should go back to angular 1 and MVC5 . For the record, I am using typescript 2.0.6, and my visual studio is completely up to date.
Is there a combination of
package.json
andtsconfig.json
that actually works out of the box with Visual Studio 2015 for angular2.
package.json
has the following dependencies.
{
"version": "1.0.0",
"name": "asp.net",
"private": true,
"devDependencies": {
"angular2": "^2.0.0-beta.17"
},
"dependencies": {
"@types/angular2": "0.0.2",
"angular2": "^2.0.0-beta.17",
"es6-shim": "^0.35.1",
"gulp": "^3.9.1",
"gulp-jasmine": "^2.4.2",
"gulp-print": "^2.0.1",
"gulp-sass": "^2.3.2",
"gulp-typings": "^2.0.4",
"gulp-watch": "^4.3.10",
"karma": "^1.3.0",
"reflect-metadata": "^0.1.8",
"rxjs": "^5.0.0-rc.2",
"zone.js": "^0.6.26"
}
}
tsconfig.json
is as follows
{
"compilerOptions": {
"experimentalDecorators": true,
"moduleResolution": "classic"
},
"exclude": ["node_modules"]
}
boot.ts
is as follows
/// <reference path="../node_modules/angular2/core.d.ts"/>
// the above is a correct path, but it doesn't seem to matter.
import {bootstrap} from "angular2/platform/browser";
// ~~~~~~~~~~~~~~~~~~~~~~~~~ (Error Here)
import {HTTP_PROVIDERS} from "angular2/http";
import {AppComponent} from "./app.component";
bootstrap(AppComponent, [HTTP_PROVIDERS]);
console.log("starting angular...");
app.component.js
/// <reference path="../node_modules/angular2/core.d.ts"/>
import { Component, OnInit } from "angular2/core";
// ~~~~~~~~~~~~~ (Error Here)
@Component({
selector: "app",
templateUrl: "static.html"
})
export class AppComponent implements OnInit {
message: string;
constructor() {
console.log("starting app component");
}
ngOnInit() {
this
.message =
"The 'static.html' was used as the Angular2 'templateUrl'. There is a 'message' property bound to the <blockqoute> element.";
}
}
NB: Make certain that es6-shim.d.ts
is installed in the wwwroot directory. Many of the node_modules
files traversed by typescript cannot be compiled without es6-shim.d.ts
I have a sample on integrating angular2(2.1.0) and ASP.NET core, I think the ng2's packages dependencies will also work on ASP.NET5.
Hope it helps!
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.