Chrome扩展 - 未设置基础href。请为APP_BASE_HREF提供一个值。

9
我正在构建一个Chrome浏览器操作扩展程序。我试图将Angular 2应用程序加载到Chrome的弹出窗口中。我以前使用Angular 1.5做过这个,但尝试使用Angular 2时出现了错误。我已经在popu.html中放置了<base href="/">标签。但问题是,Chrome会在popup.html之前(在被popup.html加载之前)加载vendor.js和main.js,因此没有HTML页面可以放置<base href="/">。我想知道如何解决这个问题。

Popup.html

enter image description here

<!doctype html>
<html>
<head>
    <base href="/">
    <meta charset="utf-8">
    <title>FountainJS</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">
    <link rel="icon" type="image/png" href="http://fountainjs.io/assets/imgs/fountain.png"/>
    <link href="../styles/popup.css" rel="stylesheet">
</head>

<body>
<div style="width: 200px; height: 150px;">
<fountain-root>My Awesome Chrome Popup should load with Angular 2 right Here</fountain-root>
<script type="text/javascript" src="../scripts/vendor.js"></script>

<script type="text/javascript" src="../scripts/main.js"></script>
</div>
</body>
</html>

1
我不明白。您正在显示当前打开选项卡的控制台,而不是弹出窗口。因此,您看到的错误来自内容脚本。您需要从浏览器操作的上下文菜单中调用“检查弹出窗口”以查看弹出窗口中发生了什么。 - Xan
谢谢Xan,你是对的,我对弹出窗口和内容脚本有些误解,所以除了APP_BASE_HREF问题之外,还有一些其他问题。 - David Cruwys
1个回答

23

您可以在代码中设置基础 href。

import { APP_BASE_HREF } from '@angular/common';

@NgModule({
  providers: [
    { provide: APP_BASE_HREF, useValue: '/' }
  ]
})
class AppModule {}

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接