Синтаксическая ошибка сценария IE 11 в Storybook 5.3. + И Angular 9.1

Question

Storybook работает с вечно зелеными браузерами, а компоненты angular работают в отдельном приложении angular nwrl в IE11

Пример рассказа

export const ctaPill = () => ({
  template: `
    <button cta-pill class=”primary" >{{ text }}</button>
  `,
  props: {
    text: text('Button text', 'CTA Pill'),
  },
});

В IE 11 приведенное выше приводит к синтаксической ошибке в строке "export const ctaPill ".

Попробовали два метода заставить сборник рассказов работать в IE 11, но каждый из них вызывает другую ошибку - я думаю, что мне не хватает полифилла или некоторых модулей @babel - ищу исправление или работу вокруг этого мне не хватает.

Метод 1 - выберите es5 в tsconfig.json

конфигурация tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "rootDir": ".",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "target": "es5"
    "module": "esnext",
    "typeRoots": ["node_modules/@types"],
    "lib": ["es2017", "dom"],
    "skipLibCheck": true,
    "skipDefaultLibCheck": true,
    "baseUrl": ".",
    "paths": {
      "@europe-core/ui": ["libs/ui/src/index.ts"]
    }
  },
  "exclude": ["node_modules", "tmp"],
  "include": ["**/*.ts", "**/*.d.ts"]
}

В консоли ошибок не возникает, но шаблоны не интерполируются и директива не разрешается

Пример не распознает директиву и визуально интерполирует {{text}} в {CTA Pill{CTA PILL CTA PILL CTA PILL} CTA PILL}

Метод 2 - конфигурация Webpack

Обновите.storybook/webpack.config.js, включив в него babel-loader.

config.module.rules.push({
    test: /\.[t|j]s$/,
    exclude: /node_modules/,
    use: {
      loader: 'babel-loader',
      options: {
        presets: [
          [
            '@babel/preset-env',
            { shippedProposals: true, useBuiltIns: 'usage', corejs: '3' },
          ],
          '@babel/preset-typescript',
          '@babel/preset-react',
          '@babel/preset-flow',
        ],
        plugins: [
          [require('@babel/plugin-proposal-decorators'), { legacy: true }],
          [require('@babel/plugin-proposal-class-properties'), { loose: true }],
          require('@babel/plugin-proposal-export-default-from'),
          require('@babel/plugin-syntax-dynamic-import'),
          [
            require('@babel/plugin-proposal-object-rest-spread'),
            { loose: true, useBuiltIns: true },
          ],
          require('babel-plugin-macros'),
          // ['emotion', { sourceMap: true, autoLabel: true }],
        ],
      },
    },
  });

Однако это вызывает другую ошибку (во всех браузерах) из-за внедрения зависимости службы значков, которая сообщает

Error: Can't resolve all parameters for IconService: (?, ?).

Удаление зависимости заставляет сборник рассказов работать, но не может вводить зависимости.