1 
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="app.css" type="text/css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.27/system.src.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/angular2-polyfills.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/Rx.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/angular2.dev.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.17/upgrade.dev.js"></script>
<body>
<h1>Angular 1 to 2</h1>
<script>
    angular.element(document).ready(function () {
        var upgrade_1 = require('angular2/upgrade');
        var upgradeAdapter = new upgrade_1.UpgradeAdapter();
        upgradeAdapter.bootstrap(document.body, ['app'], { strictDi: true });
    });
</script>
</body>
</html>

上記は、angular2 のアップグレード アダプターをセットアップするために使用しようとしている html です。

現在、アップグレード アダプターをロードしようとしています。上記の script タグ内のコードは、サンプルの typescript コードが angular Web サイトに従って js に準拠したものです。https://angular.io/docs/ts/latest/guide/upgrade.html#!#bootstrapping-hybrid-angular-1-2-applications

問題は、「'require' is undefined」というエラーが表示され続けることです。

systemjs が読み込まれないのはなぜですか?

4

1 に答える 1

1

以下は、アップグレード アダプタをセットアップする方法のステップバイステップの優れた手順です。

https://medium.com/@SevenLee/configuration-tips-to-build-hybrid-angular-1-and-angular-2-project-in-real-world-230b715629dc#.g0tsratdm

私の主な問題は、「module」：「commonjs」の代わりに「module」：「system」を使用する必要があるtsconfigファイルにありました

これにより、アップグレード アダプタ コードが次のようにコンパイルされます。

system.register(['angular2/upgrade'], function(exports_1, context_1) {
"use strict";
var __moduleName = context_1 && context_1.id;
var upgrade_1;
var upgradeAdapter;
return {
    setters:[
        function (upgrade_1_1) {
            upgrade_1 = upgrade_1_1;
        }],
    execute: function() {
        upgradeAdapter = new upgrade_1.UpgradeAdapter();
        upgradeAdapter.bootstrap(document.body, ['app'], { strictDi: true });
    }
}
});
于 2016-05-17T08:12:17.947 に答える