Angular 2 - Каков текущий (правильный) процесс начальной загрузки?

angular angular2-services angular2-http

296 просмотра

3 ответа

831 Репутация автора

Я хочу реализовать функцию безопасности Angular 2 , в частности CSRF, в которой используется XSRFStrategyпоставщик. Текущий процесс начальной загрузки, который я использую, является недостаточно недавним для реализации этого провайдера.

Это поднимает проблему поиска лучшего (правильного?) Способа загрузки и инициализации Angular 2. Я пробовал несколько подходов, и единственный, который работает, теперь устарел.

Я получил этот подход к работе:

<script src="https://code.angularjs.org/2.0.0-beta.9/angular2-polyfills.min.js"></script>
<script src="https://code.angularjs.org/tools/system.js"></script>
<script src="https://code.angularjs.org/tools/typescript.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.9/angular2.dev.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.9/Rx.min.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.9/http.dev.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.9/router.dev.js"></script>
<script>
System.config({
    transpiler: "typescript",
    packages: {
        app: { main: 'app', defaultExtension: "ts" }
    }
});
System.import("app").then(null, console.error.bind(console));
</script>

Я не могу заставить это работать (из демонстрации 5-минутного быстрого запуска Angular 2 ):

<script src="https://npmcdn.com/zone.js@0.6.12?main=browser"></script>
<script src="https://npmcdn.com/reflect-metadata@0.1.3"></script>
<script src="https://npmcdn.com/systemjs@0.19.27/dist/system.src.js"></script>
<script>
(function(global) {
    var map = {
        app:                          'app', // 'dist',
        '@angular':                   'https://npmcdn.com/@angular',
        '@angular/common':            'https://npmcdn.com/@angular/common@2.0.0-rc.4',
        'angular2-in-memory-web-api': 'https://npmcdn.com/angular2-in-memory-web-api',
        rxjs:                         'https://npmcdn.com/rxjs@5.0.0-beta.10'
    };

    var packages = {
        app:                          { main: 'app', defaultExtension: 'js' },
        rxjs:                         { defaultExtension: 'js' },
        'angular2-in-memory-web-api': { main: 'index', defaultExtension: 'js' }
    };
    var ngPackageNames = [
        'common',
        'compiler',
        'core',
        'http',
        'platform-browser',
        'platform-browser-dynamic',
        'router',
        'router-deprecated',
        'upgrade'
    ];
    // Individual files (~300 requests):
    function packIndex(pkgName) {
        packages['@angular/'+pkgName] = { main: 'index', defaultExtension: 'js' };
    }
    // Bundled (~40 requests):
    function packUmd(pkgName) {
        packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd', defaultExtension: 'js' };
    }
    var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
    ngPackageNames.forEach(setPackageConfig);
    var config = {
        map: map,
        packages: packages
    };
    System.config(config);
})(this);
</script>

Также рекомендуемая установка здесь (Plunkr) от StackOverflow, от 16 июня 2016 г. Это один специально обращается к недопустимым ошибкам поставщика из http.

Как лучше всего загрузить Angular 2?

Автор: ebakunin Источник Размещён: 18.07.2016 05:04

Ответы (3)


0 плюса

1304 Репутация автора

Вы запрашиваете лучшие практики, но используете онлайн CDN? это не может быть лучшей практикой. Вы должны следовать 5 минутам быстрого запуска как есть, или вы можете скачать угловой 2 seed с github, их много: https://github.com/angular/quickstart

https://github.com/angular/angular-cli

Удачи

Автор: Avi Размещён: 29.07.2016 06:25

1 плюс

1652 Репутация автора

Решение
Here is the bootstrap process used by the angular team. 
They created this plunker to help contributors report issues.

http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5?p=preview

Автор: Daniel Rasmuson Размещён: 02.08.2016 04:20

0 плюса

5174 Репутация автора

Текущий рекомендуемый способ начальной загрузки / запуска проекта Angular 2 - это использование Angular CLI , взгляните на этот замечательный пост! Надеюсь, это поможет ;)

Автор: Kutyel Размещён: 02.08.2016 07:16
Вопросы из категории :
32x32