Свяжите Angular2 AoT с systemjs-builder и встряхиванием дерева свертки

Я потратил много времени на то, чтобы мой проект Angular 2 работал с SystemJS, а теперь и с компиляцией AoT, как описано здесь: https://angular.io/docs/ts/latest/cookbook/aot-compiler.html

Я запускаю plugin-typescript с SystemJS для переноса машинописного текста в браузер во время разработки. У меня есть построитель systemjs, использующий plugin-typescript для создания пакета sfx из вывода AoT (ngc).

Чего я не могу понять, так это того, как заставить systemjs-builder встряхнуть дерево углового кода AoT. Из того, что я могу сказать, кажется, что systemjs-builder должен поддерживать сведение (например, https://github.com/systemjs/builder/issues/709), но я не думаю, что накопительный пакет работает для меня, когда я установил rollup:true в моих параметрах buildStatic.

Мой typescriptOptions от systemjs.config.js

transpiler: 'ts',
typescriptOptions: {
  target: 'es5',
  module: 'es6',
  emitDecoratorMetadata: true,
  experimentalDecorators: true
}

мой buildStatic звонок:

 builder.buildStatic('app/main-aot.ts', paths.wwwroot + 'dst/build-aot.sfx.min.js', {
            minify: true,
            rollup: true
        }).then(function (output) {
            console.log(output.inlineMap);
        }, function (err) {
            console.log(err);
        }),

Я получил часть о output.inlineMap из этого билета github: https://github.com/systemjs/builder/issues/639

Но мне непонятно, чего мне ожидать. Прямо сейчас он просто выводит {}

Для меня это все в новинку, может я чего-то не понимаю. Ищу кого-нибудь, кто поможет мне определить, запущен ли накопительный пакет, подтвердить, что это возможно, и, надеюсь, разобраться с этим, если это так.


typescript angular rollup systemjs systemjs-builder
person josh-sachs    schedule 04.02.2017    source источник
comment
Я сам столкнулся с тем же вопросом. И мне было интересно, нашли ли вы ответ на свой первоначальный вопрос.   -  person N.Schipper    schedule 23.05.2017
comment
@N.Schipper Я разместил ниже решение, к которому я приземлился после множества проб и ошибок. К сожалению, я так и не нашел подробного определения содержимого inlineMap, но смог достаточно хорошо ответить на свой вопрос, чтобы двигаться дальше.   -  person josh-sachs    schedule 24.05.2017

Ответы (1)


arrow_upward
1
arrow_downward

Я смог различить, что при правильном выполнении свертки свойство inlineMap в результате построителя будет коллекцией массивов имя-значение:

{ "key1": [], "key2": [] ... }

Каждый ключ отражает имя входного файла в buildStatic. Я не использую шаблоны глобусов, я запускаю buildStatic, передавая ему файл с одной точкой входа (основной) для моего углового приложения, поэтому я получаю один ключ на карте.

builder.buildStatic("main.ts", "out.sfx.min.js").then((output) => {
   console.log(output.inlineMap); // => { "main.ts": [...] }
});

Количество элементов в массиве, сопоставленное с ключом, которое я интерпретировал как количество оптимизаций, сделанных в процессе объединения... Я не уверен, что это технически на 100% точно, но я использую его в выводе сборки как уверенность в том, что процесс свертки действительно что-то сделал — где большие числа лучше.

Для потомков - я использую следующую функцию gulp для построения статических и красивых результатов печати...

const builder = require("systemjs-builder");
const filesize = require("gulp-check-filesize");

let opts = { runtime: false, minify: true, mangle: true, rollup: true }
let inFile = "main.ts";
let outFile = "main.sfx.min.js";
builder.buildStatic(infile, outFile, opts).then((output) => {
    output = output || {};

    console.log(" ");
    console.log(`Build Summary: ${inFile.toLowerCase()}`);
    console.log("---------------------------");
    return new Promise((resolve, reject) => {
        // prints output file name, size and gzip size.
        gulp.src(outFile).pipe(filesize({ enableGzip: true }))
            .on("error", reject)
            .on("end", () => {
                // build rollup sumary.
                const map = result.inlineMap || {};
                if (Object.keys(map).length <= 0) console.log("No rollup optimizations performed.");
                Object.keys(map).forEach((key) => {
                    console.log(`Rollup '${key}': ${(map[key] && map[key].length) || 0} optimizations.`);
                });

            console.log("---------------------------");
            console.log(" ");
            resolve();
        });
    });
});
person josh-sachs    schedule 24.05.2017
comment
Ах, спасибо, я посмотрю на это на работе на следующей неделе! - person N.Schipper; 29.05.2017