Пользовательский веб-компонент и угловой - PullRequest
1 голос
/ 14 октября 2019

Я создал пользовательский веб-компонент, расположенный в файле: wc-notification.js, и я хочу использовать его в своем проекте Angular, созданном с помощью Angular CLI. Я включил файл в src/index.html, но получаю сообщение об ошибке:

The resource from “http://localhost:4200/wc-notification.js” was blocked 
due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).

Как решить эту проблему?

1 Ответ

0 голосов
/ 14 октября 2019

Мне удалось сделать это следующим образом:

  1. В angular.json под projects/[my-project-name]/architect/build/options/scripts Я поставил:
"scripts": [
   "node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js",
   "src/sunpietro-notification.js"
]
В app.module.ts Я импортировал CUSTOM_ELEMENTS_SCHEMA: import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; и добавил эту схему в определение модуля:
@NgModule({
    declarations: [AppComponent],
    imports: [BrowserModule, AppRoutingModule],
    providers: [],
    bootstrap: [AppComponent],
    schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
Начал использовать мой пользовательский веб-компонент в любом шаблоне компонента.
...