папка компонентов не отображается в подсвеченном элементе - PullRequest
0 голосов
/ 12 апреля 2020

Мой проект не работает, когда я называю папку «компоненты», если я назвал любое другое имя («компонент», «макароны», «шаблоны»), он работает. Имена маршрутов в порядке, это ТОЛЬКО происходит, когда папка называется «компоненты».

Я использую lit-element в этом проекте

Работает

It works

Не работает

Doesn't work

Шаги для воспроизведения

npm i lit-element
touch index.html // Create a HTML file in the root folder
mkdir components // Create a folder where JS components will be
touch main.js // Create a component file
cd ..; polymer serve // Go back one directory and run the project

import { LitElement, html } from 'lit-element';

class MyElement extends LitElement {
    render() {
        return html`<p>template content</p>`;
    }
}
customElements.define('my-element', MyElement);
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script type="module" src="./components/main.js"></script>
    <title>lit-element code sample</title>
</head>

<body>
    <my-element></my-element>
</body>

</html>

NOTE этот фрагмент кода не запускается в StackOverflow, создайте проект и воспроизведите его.

Измените имя папки «компоненты» на любое другое имя, а затем измените маршрут в файле index.html.

1 Ответ

1 голос
/ 13 апреля 2020

Как видно из журнала, polymer serve резервирует пространство имен, начинающееся с components/, для обслуживания повторно используемых компонентов (унаследованное от старого bower_components управления зависимостями Polymer ). Это предотвращает правильное обслуживание вашей папки components. Пространство имен должно конфигурироваться с помощью опции --component-url, хотя оно не похоже на работу .

Вы можете либо

  • использовать polyserve напрямую и измените URL компонента:

    $ npm i -g polyserve
    $ polyserve --component-url mycustomcomponenturl
    
  • используйте другой сервер разработчика: open-w c 's es-dev-server - отличная альтернатива также цитируется в освещенных документах - html.

...