/ / Як використовувати @ angular / cli та non angular script - angular, webpack, angular-cli

Як використовувати @ кутовий / cli та некутовий скрипт - кутовий, webpack, кутовий-cli

Я щойно оновив додаток до Angular 5 і хотів спробувати @ angular / cli, тому що до цих пір я просто різні конфігурації вебпакету, отримані з пакета кутових початківців.

Наша конструкція прямо вперед за одним винятком, я не впевнений, як впоратися.

Ми використовуємо adal.js (в основному, бібліотека JS OAuth для Micosoft ADFS) і потрібно створити другий файл HTML з простим Javascript (транслірується з TypesScript), який не має нічого спільного з Angular. Все, що він робить, це обробляти відповідь GET від ADFS та перенаправляти на Angular Application.

Поки ми просто визначили кілька точок входу в webpack і використовуємо модуль HtmlWebpackPlugin для поділу фрагментів, як так

entry: {
"polyfills": "./src/polyfills.ts",
"main": AOT ? "./src/main.browser.aot.ts"
: "./src/main.browser.ts",
"frameRedirect": "./src/frame-redirect.ts"
},

// under plugins
new HtmlWebpackPlugin({
template: "src/frameRedirect.html",
filename: "frameRedirect.html",
chunks: ["frameRedirect"],
inject: "head"
}),
new HtmlWebpackPlugin({
template: "src/index.html",
metadata: METADATA,
chunksSortMode: "manual",
chunks: ["vendor", "polyfills", "main"]
}),

Чи надає @ angular / cli спосіб зробити це? Визначення другої програми в angular-cli.json не працює, тому що це не кутове додаток.

Або мені потрібно визначити другий процес, який компілює, знищує, мінімізує тощо мій сценарій?

Або залишитися зі стандартним веб-пакетом?

Відповіді:

0 для відповіді № 1

Основна проблема, з якої потрібно оновитизвичайний кутовий додаток до кутового / @ cli проекту полягає в тому, що вам потрібен файл .angular-cli.json, який створюється при створенні проекту: ng new projectName

Мені це вдалося, створивши кутовий проект в іншому каталозі, а потім я просто перемістив свій каталог src / app. Це найпростіше, що я міг би порекомендувати.

Повідомте мене, якщо у вас виникли труднощі;)


0 для відповіді № 2

Я відмовився від спроби (навіть не знаю, чи це навіть працює).

Що я зараз роблю

  • компілюйте файли ts (у моєму випадку frame-redirect.ts) у javascript за допомогою webpack / rollup або будь-якого іншого, що ви хочете використовувати.
  • включити його як активи в .angular-cli.json

    { "glob": "frame-redirect.js", "input": "../node_modules/a-private-package/dist/libs/", "output": "./" }
    

Я вирішив, що легше і швидше повністю покластися на angular-cli для мого додатка і провести другий / не пов'язаний між собою процес побудови (який повинен запускатися перед тим, як скласти кутовий додаток).