Как я могу настроить мое приложение Angular для использования CLI для производства и JIT для разработки?

Question

Цель

С одной унифицированной кодовой базой я хочу иметь возможность...

1. компилировать с CLI и обслуживать все приложение с полученными в комплекте файлами
2. использовать JIT-компиляцию и обслуживать приложение с каждым файлом, имеющим собственный сетевой запрос (без объединения)

текущая попытка

До сих пор я создавал отдельные файлы tsconfig для каждой сборки.

Моя основная трудность - установка путей для templateUrl в компонентах.

CLI использует относительные пути для templateUrl по умолчанию, в то время как JIT требует, чтобы moduleId был установлен на компоненте, чтобы использовать относительные пути.

например

@Component({
  selector: 'app-root',
  moduleId : module.id,
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.less']
})

... работает в режиме dev (commonjs), но не работает в режиме prod (CLI) со следующей ошибкой:

Не удается найти имя модуля. Вам нужно установить определения типа для узла? Пытаться npm i @types/node,

При удалении module.id работает с CLI, но не с commonjs. В этом случае браузер не может найти html-файл, потому что он ищет в корне источника.

Я пытался..

• (с оговорками) установка типа узла
• литье "модуль" как любой
• окружающее объявление "модуля",
  • объявить модуль const: {id: any};
• модуль обтекания в функцию, которая выполняет условную оценку только в сценарии commonjs
  • т.е. moduleId : environment.bundled ? undefined : (() => module.id)()

и все потерпели неудачу по разным причинам.

Любые предложения по этому подходу или новый подход будут оценены по достоинству.

Answer 1

В конце концов, я обнаружил, что vsCode был более строгим, чем tsc или CLI, и я смог просто

1. объявлять module в файле .d.ts,
2. добавьте его к моим типам в tsconfig для версии CLI (prod) и
3. исключить его в tsconfig для версии JIT (dev).

SRC /ambient.d.ts

declare var module: {id: string};

TSconfig-cli.json

{
    "compileOnSave": false,
    "compilerOptions": {
        ...
        "module": "es2015",
        "moduleResolution": "node",
        ...
        "types": [
            "src/ambient.d.ts"
        ]
    }
}

TSconfig-dev.json

{
    "compilerOptions": {
        ...
        "module": "commonjs",
        "moduleResolution": "node",
        ...
    },
    ...
    "exclude":[
      "src/main/main.ts",
            "src/ambient.d.ts"
    ]
}