在 2016/05/02 angular2 就已發佈至 RC 0
緊接著在 2016/05/02 又發佈了 RC1
升級的過程一直不順利，
看來無法跟之前一樣，package 版本的數字改一改就好，
要乖乖看文件了！
終於把問題解決了，大致要處理的部分如下：
- package module rename
- typescript typing
- systemjs.config.js
package module rename
node_module 資料夾下，angular2 資料夾換成 ＠angular 當然底下的路徑都換了，
所以要將以下 package 路徑做替換，
詳情如下：
To import various symbols please adjust the paths in the following way:
angular2/core -> @angular/coreangular2/compiler -> @angular/compilerangular2/common -> @angular/commonangular2/platform/browser -> @angular/platform-browser (applications with precompiled templates) + @angular/platform-browser-dynamic (applications that compile templates on the fly)angular2/platform/server -> @angular/platform-serverangular2/testing -> @angular/core/testing (it/describe/..) + @angular/compiler/testing (TestComponentBuilder) + @angular/platform-browser/testingangular2/upgrade -> @angular/upgradeangular2/http -> @angular/httpangular2/router -> @angular/router-deprecated (snapshot of the component router from beta.17 for backwards compatibility)- new package:
@angular/router - component router with several breaking changes
typescript typing
接著設定 typescript typing (
參考 )：
在專案根目錄新增 typings.json 檔案，內容：
{
"ambientDependencies": {
"es6-shim": "registry:dt/es6-shim#0.31.2+20160317120654",
"jasmine": "registry:dt/jasmine#2.2.0+20160412134438"
}
}
設定 package.json
在 Visual Studio 2015 對 package.json 儲存後，
即會在專案根目錄下，建立 typeings 資料夾，
在 root componment 加入
typings/browser/ambient/es6-shim/index.d.ts reference
systemjs.config.js (參考)
html 頁面使用方式，
<!-- 1. Load libraries -->
<script src="~/node_modules/es6-shim/es6-shim.min.js"></script>
<script src="~/node_modules/zone.js/dist/zone.js"></script>
<script src="~/node_modules/reflect-metadata/Reflect.js"></script>
<script src="~/node_modules/systemjs/dist/system.src.js"></script>
<script type="text/javascript">
window.filterSystemConfig = function (config) {
config.baseURL = '@Url.Content("~/")';
}
</script>
<!-- 2. Configure SystemJS -->
<script src="~/systemjs.config.js"></script>
<script type="text/javascript">
System.import('PublishScenario')
.catch(function (err) { console.error(err); });
</script>
其中指定 config.baseURL 為 網站的根目錄
<script type="text/javascript">
window.filterSystemConfig = function (config) {
config.baseURL = '@Url.Content("~/")';
}
</script>
systemjs.config.js 的內容如下：
(function (global) {
// map tells the System loader where to look for things
var map = {
'PublishScenario': 'Scripts/angular-app/PublishScenario', // 'dist',
'rxjs': 'node_modules/rxjs',
'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
'@angular': 'node_modules/@angular',
'ng2-bs3-modal': 'node_modules/ng2-bs3-modal'
};
// packages tells the System loader how to load when no filename
// and/or no extension
var packages = {
'PublishScenario': {
main: 'main.js',
defaultExtension: 'js'
},
'rxjs': { defaultExtension: 'js' },
'ng2-bs3-modal': { main: 'ng2-bs3-modal.js', defaultExtension: 'js' },
'angular2-in-memory-web-api': { defaultExtension: 'js' },
};
var packageNames = [
'@angular/common',
'@angular/compiler',
'@angular/core',
'@angular/http',
'@angular/platform-browser',
'@angular/platform-browser-dynamic',
'@angular/router',
'@angular/router-deprecated',
'@angular/testing',
'@angular/upgrade',
];
// add package entries for angular packages in the form
// '@angular/common': { main: 'index.js', defaultExtension: 'js' }
packageNames.forEach(function (pkgName) {
packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
});
var config = {
map: map,
packages: packages
}
// filterSystemConfig - index.html's chance to modify
// config before we register it.
if (global.filterSystemConfig) { global.filterSystemConfig(config); }
System.config(config);
})(this);
以上是查看官方文件後，進行的設定，若仍有問題，就到
官網去看看吧！
