J'ai déjà utilisé Angular1 et bien que le processus d'apprentissage soit un peu courbe, j'ai l'impression qu'il est relativement fluide étape par étape, et il est principalement utilisé dans certains projets personnels. Plus tard, j'ai essayé Vue et j'ai senti que c'était le cas. plus convivial et efficace, je l'ai donc utilisé pour quelques petits projets. Le projet a été construit en utilisant vue.

À l'heure actuelle, Ng2 a publié la version officielle. Compte tenu de la communauté, des ressources et de la documentation de Ng, je ne peux m'empêcher de vouloir l'essayer. Après l'avoir essayé, j'ai commencé à me demander si je l'utilisais de la mauvaise manière. . J'ai principalement rencontré les problèmes suivants :

1 Problèmes d'intégration avec Webpack

J'ai passé toute la matinée (journée des questions) à suivre le document étape par étape, et finalement j'ai même copié directement tout le contenu du fichier impliqué dans le document, mais il n'a toujours pas pu s'exécuter. Google n'a pas pu résoudre complètement diverses erreurs. Bref, j'ai de nouveau rencontré la version Typescript, version webpack. En fin de compte, je n'ai eu d'autre choix que de trouver quelque chose comme webpack-starter, de l'exécuter, puis j'ai commencé à vérifier la configuration. J'ai découvert que webpack dans le démarreur était la version 2.x. raison principale. Il n'y a pas de dépôt sur le site officiel qui peut être cloné. Vous ne pouvez pas encore exécuter, vraiment ? ? ?

La raison pour laquelle j'espère construire l'environnement étape par étape est que lorsque j'entre en contact avec une nouvelle chose, je devrais savoir ce que je fais, plutôt que d'avoir un plan vaste et complet, sinon je ne saurai pas où le problème est causé (TypeScript, Systemjs, Ng2 est relativement nouveau pour moi).

De plus, la raison pour laquelle webpack est utilisé est que le workflow basé sur webpack est déjà très familier et que le gestionnaire de modules Systemjs n'a trouvé aucun avantage évident à l'heure actuelle, car sur la base des conditions existantes, je pense que l'empaquetage, la compression , le hachage Naming et autres sont toujours nécessaires. Est-il vraiment judicieux d'utiliser Systemjs pour faire des requêtes insensées ?

2 Dépendances

Quand j'ai commencé à utiliser NG2, j'ai découvert que je devais constamment copier et coller plusieurs bibliothèques, telles que polyfills zone rxjs, etc., et j'étais confus. Ce sont les bibliothèques nécessaires au fonctionnement de Ng2. ne définissez-vous pas vous-même les dépendances ? Voulez-vous que l’utilisateur les ajoute un par un manuellement ? Il y a aussi les polyfills, je pensais qu'ils ne prenaient en charge qu'IE, et je pensais que je me concentrerais uniquement sur Chrome et ne les ajouterais pas, mais c'est resté bloqué pendant longtemps. Il s'avère que Chrome a également besoin de cette chose, et je n'en ai vraiment pas besoin. je ne veux pas me plaindre.

3 tailles de cadre

Après avoir à peine exécuté, empaquetez les fichiers en mode production, essentiellement trois applications du fournisseur polyfills :
polyfills.ts :

import 'core-js/client/shim';
import 'reflect-metadata';
require('zone.js/dist/zone');
import 'ts-helpers';
if (process.env.ENV === 'build') {
  // Production
} else {
  Error['stackTraceLimit'] = Infinity;
  require('zone.js/dist/long-stack-trace-zone');
}

fournisseur.ts :

// Angular 2
import '@angular/platform-browser';
import '@angular/platform-browser-dynamic';
import '@angular/core';
import '@angular/common';
import '@angular/http';
import '@angular/router';

import 'rxjs';
import '@angularclass/hmr';

Une fois les trois fichiers compressés et obscurcis, le total est d'environ 1,2 million. C'est vraiment haha ​​​​il n'y a aucune comparaison avec Vue à cet égard

Organisation à 4 composantes

Traditionnellement, un composant correspond à un fichier ts html moins (bien que le fichier html puisse être écrit en ts sur plusieurs lignes, mais il est anti-humain pour les modèles avec plus de contenu), ce qui semble vraiment gros, y a-t-il un. fichier similaire à .vue qui peut gérer les composants de manière centralisée ?

En bref, le processus d'utilisation de Ng2 est vraiment frustrant (la partie intégration avec webpack), donc j'aimerais demander quels sont les avantages de Ng2 actuellement ?