Vraag Waar is angular2-polyfills nu dat niet-beta Angular 2 is verpakt als @angular?


Nu Angular2 uit bèta is (2.0.0-RC.0 en RC.1 uit gisteren / 3 mei 2016), is alle Angular 2 verpakt voor gebruik met NPM onder de nieuwe @angular namespace. Veel pakketten zijn verplaatst en moeten nu afzonderlijk worden geïnstalleerd, zoals u kunt zien in de Angular2 CHANGELOG.

Maar een ding dat de CHANGELOG niet aanpakt, is hoe je de angular2-polyfills bundel die eerder beschikbaar was.

Mijn bètacode heeft dit in een van zijn TypeScript-bestanden genoemd:

import 'angular2/bundles/angular2-polyfills';

Wat moet ik nu doen om dezelfde functionaliteit te krijgen met de nieuwe lay-out van het pakket?

Hier is de ventdor.ts bestand dat werd gebruikt om de polyfills te importeren, zodat deze kon worden opgenomen door webpack:

require('./css/bootstrap.css');
require('./css/main.css');

import 'angular2/bundles/angular2-polyfills'; // THIS NO LONGER WORKS

require('./lib/bootstrap/bootstrap.js');

Het ontbreken van de polyfills veroorzaakt fouten zoals de volgende wanneer ik mijn applicatie bouw met webpack:

ERROR in /Users/mfo/Projects/PennMutual/angular2-oauth2/node_modules/@angular/core/src/facade/async.d.ts
(28,45): error TS2304: Cannot find name 'Promise'.

ERROR in /Users/mfo/Projects/PennMutual/angular2-oauth2/node_modules/@angular/core/src/facade/lang.d.ts
(4,17): error TS2304: Cannot find name 'Map'.

ERROR in /Users/mfo/Projects/PennMutual/angular2-oauth2/node_modules/@angular/core/src/facade/lang.d.ts
(5,17): error TS2304: Cannot find name 'Set'.

24
2018-05-04 17:49


oorsprong


antwoorden:


Zoals Thierry Templier in zijn antwoord zei, is de kwestie dat zone.js en reflect-metadata moet worden ingebracht nu de angular2-polyfills.js bundel is niet langer beschikbaar.

Om de functionaliteit terug te krijgen, moet u ze direct importeren in plaats van te vertrouwen op de oude polyfills-code.

//import 'angular2/bundles/angular2-polyfills'; // no longer available
import 'reflect-metadata';
require('zone.js/dist/zone');
require('zone.js/dist/long-stack-trace-zone'); // for development only - not needed for prod deployment

De reflect-metadata pakket heeft al ingebouwde typografie voor TypeScript, zodat u het kunt gebruiken import. Zone.js hoeft echter niet te vertrouwen require() om webpack op te halen en op te nemen in uw bundels.

Natuurlijk moet je ook reflecteren en zone in je hebben package.json afhankelijkheden sectie (de mijne staan ​​onderaan, hieronder):

{
  "name": "angular2-bootstrap4-oauth2-ohmy",
  "version": "1.0.8",
  "description": "A skeleton Angular2, Bootstrap 4, OAuth2 application using webpack (oh my!)",
  "repository": "https://github.com/michaeloryl/angular2-bootstrap4-oauth2-webpack.git",
  "dependencies": {
    "@angular/common": "^2.0.0-rc.1",
    "@angular/compiler": "^2.0.0-rc.1",
    "@angular/core": "^2.0.0-rc.1",
    "@angular/http": "^2.0.0-rc.1",
    "@angular/platform-browser": "^2.0.0-rc.1",
    "@angular/platform-browser-dynamic": "^2.0.0-rc.1",
    "@angular/router": "^2.0.0-rc.1",
    "@angular/router-deprecated": "^2.0.0-rc.1",
    "bootstrap": "4.0.0-alpha.2",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.35.0",
    "jquery": "^2.1.4",
    "js-cookie": "^2.1.0",
    "lodash": "^4.11.2",
    "phantomjs-prebuilt": "^2.1.7",
    "require": "^2.4.20",
    "rxjs": "^5.0.0-beta.6",
    "traceur": "0.0.93",
    "reflect-metadata": "^0.1.2",
    "zone.js": "^0.6.12"
  },
}

Zodra dat is gebeurd, zou je opnieuw een werkende applicatie moeten hebben (ervan uitgaande dat je voor de andere problemen zorgde die betrokken waren bij het overstappen van Angular2 beta naar de RC (release candidate) code.

Deze code is een voorbeeld van mijn angular2-bootstrap4-OAuth2-webpack project op Github.


14
2018-05-05 15:12



Er is niet meer angular2-polyfills.js het dossier. U moet expliciet ZoneJS en Reflect Metadata-bibliotheken opnemen (FYI angular2-polyfill bevatte deze twee bibliotheken). Dus u moet het volgende opnemen:

<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/reflect-metadata/Reflect.js"></script>

6
2018-05-04 18:41



Ik had onlangs dit probleem met rc.5 en loste het op door zone als volgt te importeren:

// import 'angular2/bundles/angular2-polyfills'; // old
import 'reflect-metadata';
import 'zone.js/dist/zone'; 
import 'zone.js/dist/long-stack-trace-zone';

3
2017-08-11 17:47