Solution Webpack pour le mappage SystemJS

Question

La version d'AngularCLI abandonne SystemJS en faveur de WebPack.

Cependant, SyncFusion n'a pas encore supporté WebPack dans sa bibliothèque EJ2 pour Angular. Ils instruisent à utiliser SystemJS à la carte

"@syncfusion/ej2-grids": "node_modules/@syncfusion/ej2-grids/dist/ej2-grids.umd.min.js", 
"@syncfusion/ej2-ng-grids": "node_modules/@syncfusion/ej2-ng-grids/dist/ej2-ng-grids.umd.min.js", 

dans ce tutoriel http://ej2.syncfusion.com/angular/documentation/grid/getting-started.html#configuring-system-js

Comment puis-je travailler autour de cette dépendance et le rendre compatible avec WebPack en attendant Syncfusion pour le soutenir?

Answer 1

Même chose se fait en Webpack avec resolve.alias:

... 
resolve: { 
    alias: { 
    "@syncfusion/ej2-grids$": "@syncfusion/ej2-grids/dist/ej2-grids.umd.min.js", 
    ... 
} 

La raison pour laquelle les correspondances sont utilisés dans SystemJS est qu'un fichier UMD seul préconstruits peut être transféré au lieu de transfering et de construire des fichiers séparés. Ce n'est pas un problème pour Webpack. Alors que le module UMD peut accélérer un peu le processus, l'utilisation de modules ES6 dégroupés provenant d'un package (si disponible) permet d'utiliser l'agitation des arbres et peut réduire l'empreinte de l'application.

Answer 2

Les composants JS2 Angular essentiels ont la prise en charge Webpack sans aucune solution de contournement. S'il vous plaît trouver l'extrait de code

var webpack = require('webpack'); 
module.exports = { 
entry: { 
    'app': './app/main.ts' 
}, 

resolve: { 
    extensions: ['.js'] 
}, 
output: { 
    path: __dirname + '/dist', 
    publicPath: '/', 
    filename: 'app.js', 
} 
}; 

échantillon webpack lien: https://github.com/Madhust/ej2-grid-angular-webpack