Angular 2 AOT Webpack CSS относительный вложенный URL

Question

Я использую https://materialdesignicons.com/ в своем проекте, и я импортирую его CSS внутри моего собственного файла CSS.

Вот как это делается:

app.component.css

@import "../node_modules/mdi/css/materialdesignicons.min.css";

materialdesignicons.css

@font-face {
  font-family: "Material Design Icons";
  src: url("../fonts/materialdesignicons-webfont.eot?v=1.7.22");
  src: url("../fonts/materialdesignicons-webfont.eot?#iefix&v=1.7.22") format("embedded-opentype"), url("../fonts/materialdesignicons-webfont.woff2?v=1.7.22") format("woff2"), url("../fonts/materialdesignicons-webfont.woff?v=1.7.22") format("woff"), url("../fonts/materialdesignicons-webfont.ttf?v=1.7.22") format("truetype"), url("../fonts/materialdesignicons-webfont.svg?v=1.7.22#materialdesigniconsregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

Теперь начальный импорт (из app.component.css) и вложенный импорт (materialdesignicons.css) отлично работает с to-string-loader!css-loader на webpack-dev-server

Однако при использовании CLI компилятора Angular 2 не удастся импортировать вложенный URL (шрифт).

Я получаю ошибку 404, когда вижу, что проект пытается получить шрифт относительно основного файла CSS (app.component.css).

Webpack.common.config.js (Загрузчики)

loaders: [
        {
            test: /\.ts$/,
            loaders: [
                'awesome-typescript-loader',
                'angular2-template-loader',
                'angular2-router-loader'
            ]
        },
        {
            test: /\.html$/,
            loader: 'html'
        },
        {
            test: /\.css$/,
            loaders: [
                'to-string',
                'css'
            ]
        },
        {
            test: /\.(eot|svg|ttf|woff|woff2)$/,
            loader: 'file?name=[path][name].[ext]'
        }
    ]

Answer 1

Хорошо, я нашел альтернативу для моего случая:

Используя ссылку CDN, и, таким образом, относительные пути обрабатываются в облаке.

Ссылка, которую я использовал: https://cdn.materialdesignicons.com/1.7.22/css/materialdesignicons.min.css

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