Question

我需要在环境文件中加载外部css文件。我有两种环境： dev 和 prod 。它在模式开发中运行良好，因为css文件在本地，但不在模式下。

environment.dev.ts

require("style-loader!./../assets/style.css");

environment.prod.ts

require("style-loader!http://abc/style.css");

然后我有这个错误：

无法解决＆＃39; http://abc/sprite.css＆＃39;

我怎样才能让它与url一起使用？

谢谢！

更新

根据Milad的建议，我尝试使用动态 href 建立链接：

<link [attr.href]="getCss()" type="text/css">

function getCss(): string {
    return this.mode === 'dev' ?
        'assets/style.css':
        'http://abc/sprite.css';
}

我有以下错误：

资源URL上下文中使用的不安全值

Answer 1

您在webpack的加载程序配置中无法进行http调用，因为从技术上讲，生产环境中不存在加载程序。

所以

  require("style-loader!http://abc/style.css");

你说的是：

嗨webpack，当您构建我的应用时，请调用此网址并获取CSS并将其包含在捆绑包中。

这不应该有效，因为Webpack不应该拨打外部电话来获取你的捆绑件。

尝试下载css并将其放入代码中。

如何在Angular 2中使用require加载外部css

1 个答案: