blocks|key|4428239|text|为了回答我最初的问题，这就是我们如何在.net+4.5.1上启动并运行Angular+2(我们最终不得不使用npm)。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4428240|在_Layout.cshtml的header中，从cdn导入Angular+2文件，并配置了SystemJ。|4428241|

<script+src="../../node_modules/es6-shim/es6-shim.min.js"></script>
<script+src="../../node_modules/systemjs/dist/system-polyfills.js"></script>
<script+src="../../node_modules/angular2/es6/dev/src/testing/shims_for_IE.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>


<script>
++System.config({
++++packages:+{
++++++++'my-app':+{
++++++++format:+'register',
++++++++defaultExtension:+'js'
++++++}
++++}
++});
++++System.import('my-app/main')
++++++++.then(null,+console.error.bind(console));
</script>|code-block|syntax|javascript|4428242|在工程路由中添加package.json和tsconfig.json|4428243|packages.json：|4428244|{
+"name":+"angular2-quickstart",
+"version":+"1.0.0",
+"scripts":+{
++"tsc":+"tsc",
++"tsc:w":+"tsc+-w",
++"typings":+"typings",
++"postinstall":+"typings+install"
++},
+"license":+"ISC",
+"dependencies":+{
++"angular2":+"2.0.0-beta.9",
++"systemjs":+"0.19.24",
++"es6-promise":+"%5E3.0.2",
++"es6-shim":+"%5E0.35.0",
++"reflect-metadata":+"0.1.2",
++"rxjs":+"5.0.0-beta.2",
++"zone.js":+"0.5.15"
+},
+"devDependencies":+{
++"typescript":+"%5E1.8.7",
++"typings":+"%5E0.7.5"
++}
}|4428245|tsconfig.json：|4428246|{
+"compileOnSave":+true,
+"compilerOptions":+{
+"target":+"es5",
+"module":+"system",
+"moduleResolution":+"node",
+"sourceMap":+true,
+"emitDecoratorMetadata":+true,
+"experimentalDecorators":+true,
+"removeComments":+false,
+"noImplicitAny":+false
},
"exclude":+[
+"node_modules",
+"typings/main",
+"typings/main.d.ts"
+]
}|4428247|如果您的机器上安装了node和npm，它应该会自动下载您需要的npm模块，并将它们保存在node_modules文件夹中。您现在应该已经准备好设置Angular+2应用程序了，我们使用this开始。|offset|length|4428248|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/johnpapa/angular2-tour-of-heroes^0|0|0|0|0|0|0|0|0|2K|4|0|0^^$0|@$1|2|3|4|5|6|7|14|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|15|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|16|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|17|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|18|8|@]|9|@]|A|$]]|$1|M|3|N|5|F|7|19|8|@]|9|@]|A|$G|H]]|$1|O|3|P|5|6|7|1A|8|@]|9|@]|A|$]]|$1|Q|3|R|5|F|7|1B|8|@]|9|@]|A|$G|H]]|$1|S|3|T|5|6|7|1C|8|@]|9|@$U|1D|V|1E|1|1F]]|A|$]]|$1|W|3|-4|5|6|7|1G|8|@]|9|@]|A|$]]]|X|$Y|$5|Z|10|11|A|$12|13]]]]

<p>To answer my original question, this is how we have managed to get Angular 2 up and running with .net 4.5.1 (we did end up having to use npm).</p>

<p>In the header of _Layout.cshtml, imported the Angular 2 files from the cdn and configured SystemJs.</p>

<pre><code>&lt;!-- 1. Load libraries --&gt;
&lt;!-- IE required polyfills, in this exact order --&gt;
&lt;script src="../../node_modules/es6-shim/es6-shim.min.js"&gt;&lt;/script&gt;
&lt;script src="../../node_modules/systemjs/dist/system-polyfills.js"&gt;&lt;/script&gt;
&lt;script src="../../node_modules/angular2/es6/dev/src/testing/shims_for_IE.js"&gt;&lt;/script&gt;

&lt;script src="../../node_modules/angular2/bundles/angular2-polyfills.js"&gt;&lt;/script&gt;
&lt;script src="../../node_modules/systemjs/dist/system.src.js"&gt;&lt;/script&gt;
&lt;script src="../../node_modules/rxjs/bundles/Rx.js"&gt;&lt;/script&gt;
&lt;script src="../../node_modules/angular2/bundles/angular2.dev.js"&gt;&lt;/script&gt;

&lt;!-- 2. Configure SystemJS --&gt;
&lt;script&gt;
  System.config({
    packages: {
        'my-app': {
        format: 'register',
        defaultExtension: 'js'
      }
    }
  });
    System.import('my-app/main')
        .then(null, console.error.bind(console));
&lt;/script&gt;
</code></pre>

<p>Added package.json and tsconfig.json to the route of the project</p>

<p>packages.json:</p>

<pre><code>{
 "name": "angular2-quickstart",
 "version": "1.0.0",
 "scripts": {
  "tsc": "tsc",
  "tsc:w": "tsc -w",
  "typings": "typings",
  "postinstall": "typings install"
  },
 "license": "ISC",
 "dependencies": {
  "angular2": "2.0.0-beta.9",
  "systemjs": "0.19.24",
  "es6-promise": "^3.0.2",
  "es6-shim": "^0.35.0",
  "reflect-metadata": "0.1.2",
  "rxjs": "5.0.0-beta.2",
  "zone.js": "0.5.15"
 },
 "devDependencies": {
  "typescript": "^1.8.7",
  "typings": "^0.7.5"
  }
}
</code></pre>

<p>tsconfig.json:</p>

<pre><code>{
 "compileOnSave": true,
 "compilerOptions": {
 "target": "es5",
 "module": "system",
 "moduleResolution": "node",
 "sourceMap": true,
 "emitDecoratorMetadata": true,
 "experimentalDecorators": true,
 "removeComments": false,
 "noImplicitAny": false
},
"exclude": [
 "node_modules",
 "typings/main",
 "typings/main.d.ts"
 ]
}
</code></pre>

<p>If you have node and npm installed on your machine, it should automatically download the npm modules you need, and save them in the node_modules folder. You should now be ready to set up an Angular 2 application, we used the <a href="https://github.com/johnpapa/angular2-tour-of-heroes" rel="noreferrer">this</a> to get started.</p>


blocks|key|4428192|text|他们已经用一个非核心方案更新了Angular站点：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4428193|https://angular.io/docs/ts/latest/cookbook/visual-studio-2015.html|offset|length|4428194|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|1U|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|N|8|@]|9|@$D|O|E|P|1|Q]]|A|$]]|$1|F|3|-4|5|6|7|R|8|@]|9|@]|A|$]]]|G|$H|$5|I|J|K|A|$L|C]]]]

<p>They've updated the Angular site with a non-Core scenario:</p>

<p><a href="https://angular.io/docs/ts/latest/cookbook/visual-studio-2015.html" rel="nofollow">https://angular.io/docs/ts/latest/cookbook/visual-studio-2015.html</a></p>


blocks|key|4428283|text|我已经为Angular+2.0创建了一个启动项目，它刚刚在https://github.com/chanoto89/angular2-startup上与ASP.NET+4.5.2一起上线。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4428284|我使用了http://blogs.msmvps.com/deborahk/angular-2-getting-started-with-a-visual-studio-2015-asp-net-4-x-project/大纲，但利用了MVC和gulp在项目中移动所需依赖项的优势，而不是使用npm安装的整个node_modules。|4428285|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/chanoto89/angular2-startup|1|http://blogs.msmvps.com/deborahk/angular-2-getting-started-with-a-visual-studio-2015-asp-net-4-x-project/^0|T|19|0|0|4|2X|1|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@$A|Q|B|R|1|S]]|C|$]]|$1|D|3|E|5|6|7|T|8|@]|9|@$A|U|B|V|1|W]]|C|$]]|$1|F|3|-4|5|6|7|X|8|@]|9|@]|C|$]]]|G|$H|$5|I|J|K|C|$L|M]]|N|$5|I|J|K|C|$L|O]]]]

<p>I have created a startup project for Angular 2.0 which just went live at <a href="https://github.com/chanoto89/angular2-startup" rel="nofollow">https://github.com/chanoto89/angular2-startup</a> with ASP.NET 4.5.2. </p>

<p>I used the <a href="http://blogs.msmvps.com/deborahk/angular-2-getting-started-with-a-visual-studio-2015-asp-net-4-x-project/" rel="nofollow">http://blogs.msmvps.com/deborahk/angular-2-getting-started-with-a-visual-studio-2015-asp-net-4-x-project/</a> outline, but took advantage of using MVC as well as gulp to move the needed dependencies inside the project rather than using the entire node_modules installed by npm. </p>


blocks|key|4428296|text|我关注了https://angular.io/docs/ts/latest/cookbook/visual-studio-2015.html并遇到了一个问题，这只是为了在有人遇到同样的问题时提供帮助。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4428297|由于某些原因，我在一个新项目中没有在package.json上获得恢复包选项，重新启动visual+studio+2015专业再次带来了这个选项。|4428298|我不得不在项目文件夹中复制systemjs.config.js，否则它在加载时被卡住了……，开发者栏显示systemjs.config.js的404，复制它带来了“我的第一个Angular帮助”。|4428299|entityMap|0|LINK|mutability|MUTABLE|url|https://angular.io/docs/ts/latest/cookbook/visual-studio-2015.html^0|4|1U|0|0|0|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@$A|Q|B|R|1|S]]|C|$]]|$1|D|3|E|5|6|7|T|8|@]|9|@]|C|$]]|$1|F|3|G|5|6|7|U|8|@]|9|@]|C|$]]|$1|H|3|-4|5|6|7|V|8|@]|9|@]|C|$]]]|I|$J|$5|K|L|M|C|$N|O]]]]

<p>I followed <a href="https://angular.io/docs/ts/latest/cookbook/visual-studio-2015.html" rel="nofollow">https://angular.io/docs/ts/latest/cookbook/visual-studio-2015.html</a> and ran into an issue, this is just to help if someone runs into same.</p>

<p>For some reason I wasn't getting restore packages option on package.json on a new project, restarting the visual studio 2015 profession brought the option again.</p>

<p>And I had to copy systemjs.config.js in projects folder else it was stuck on Loading ... , developer bar showed 404 for systemjs.config.js and copying it brought 'My First Angular Help'.</p>


<p>I would like to use Angular 2 for the front end of an existing ASP.NET 4 app, i.e. not MVC 6/ASP.NET CORE, and I'd rather not use node as we are already using nuget as our package manager. Does anyone know of any resources that will guide me through this?</p>


AngularJs 2 with ASP .NET 4.5.1

包管理器

路由

我想使用Angular 2作为现有的ASP.NET 4应用的前端，也就是说，不是MVC6/ASP.Net核心，我不想使用node，因为我们已经使用nuget作为包管理器了。有没有人知道有什么资源可以指导我完成这件事？

问AngularJs 2，带ASP .NET 4.5.1
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问AngularJs 2，带ASP .NET 4.5.1EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问AngularJs 2，带ASP .NET 4.5.1
EN