Chrome extension - no href core set. Enter value for APP_BASE_HREF

I am creating a Chrome browser action extension.

I am trying to load an Angular 2 application into a popup in Chrome.

I did this before using Angular 1.5, but tried using Angular 2 and get an error message.

Refusal from the raw promise: there is no basic set of href. Specify the cost for the marker APP_BASE_HREF or add a base element to the document .; Zone:; Task: Promise.then; Value: error: no basic href setting. Specify a value for the APP_BASE_HREF token or add a base element to the document. (...) Error: no href core set. Please provide a value for the APP_BASE_HREF token or add a base element to the document.

I put the <base href="/"> in my popu.html. But the problem is that vendor.js and main.js are loaded under Chrome (and before loading popup.html), and therefore there is no HTML page where you can put <base href="/">

Just wondering how I can solve this problem.

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> 
+6
source share
1 answer

Instead, you can set base href in code

 import { APP_BASE_HREF } from '@angular/common'; @NgModule({ providers: [ { provide: APP_BASE_HREF, useValue: '/' } ] }) class AppModule {} 
+19
source

Source: https://habr.com/ru/post/1011740/


All Articles