Question

我正在使用以下代码向MdIconRegistry添加图标：

constructor(iconRegistry: MdIconRegistry, sanitizer: DomSanitizer) {
  iconRegistry.addSvgIconSet(
    sanitizer.bypassSecurityTrustResourceUrl('/assets/svg-sprite-action-symbol.svg'));
  iconRegistry.addSvgIconSet(
    sanitizer.bypassSecurityTrustResourceUrl('/assets/svg-sprite-content-symbol.svg'));
  iconRegistry.addSvgIconSet(
    sanitizer.bypassSecurityTrustResourceUrl('/assets/svg-sprite-navigation-symbol.svg'));
}

使用ng [build|serve] --deploy-url=/public/时不幸中断了（生产中我希望将ng build输出部署到CDN）

有没有办法可以从我的角度组件访问webpack publicPath变量，以便我可以指定相对于svg图标的url？

我查看了ng build输出，我可以看到变量是在inline.bundle.js中设置的，但我不确定如何正确访问它。

/******/    __webpack_require__.p = "/public/";

Answer 1

如果您有权访问webpack-configration file，那么您可以轻松获取公共路径

假设您的项目根目录中有webpack.config.js，而/src/component/mycomponent.js

中有组件文件

你的webpack.config.js是这样的

module.exports = {
.
.
.
 output: {
   path: "somthing",
   filename: "somthing",
   publicPath: "something"
 }
.
.
.
}

那就像

import webpackConfig from "../../webpack.config.js

const publickPath = webpackConfig.output.publicPath

webpack配置文件就像另一个javascript文件，你可以从中导入内容

Answer 2

您可以从“ webpack_public_path ”全局变量中获取它。

我如何获得webpack publicPath

2 个答案: