Chrome Extension - No base href set. Please provide a value for the APP_BASE_HREF

问题

I am building a Chrome Browser Action Extension.

I am attempting to load an Angular 2 application into the Popup Window in Chrome.

I have done this before using Angular 1.5, but attempting with Angular 2 and getting an error.

Unhandled Promise rejection: No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document. ; Zone: ; Task: Promise.then ; Value: Error: No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document.(…) Error: No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document.

I have put the <base href="/"> tag into my popu.html. But the problem is that vendor.js and main.js get loaded underneath by Chrome (and before being loaded by popup.html) and so there is no HTML page in which to put <base href="/">

Just wondering how I can resolve this issue.

Popup.html

<!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:

You could set the base href in code instead

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

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

来源：https://stackoverflow.com/questions/40274540/chrome-extension-no-base-href-set-please-provide-a-value-for-the-app-base-hre

标签

javascript

angular

google-chrome-extension