使用匯總將svelte html文件導入js文件

Question

js文件：

import template from './Template.html';

class VacationListForCompany extends HTMLElement {

constructor() {
    super();
    const root = this.attachShadow({mode:'open'});

    const t = new template({ target: root });

  }
}

window.customElements.define("vacation-list-for-company", 
VacationListForCompany);

Svelte / HTML文件

<h1> This is from SVELTE </h1>
<script>
    export default {
    };
</script>

在我的Rollupfile中，從'rollup-plugin-svelte'導入svelte；

export default {
   input: 'Widgets/VacationListForCompany/widget.js',
   output: {
      format: 'iife',
      file: 'dist/vacationlistforcompany.js',
  },
  plugins: [
    svelte({ include:'*.html'})
  ],
};

好像匯總不能在導入時生成苗條的組件。我在這里誤解了嗎？

Answer 1

默認情況下，Svelte將HTML文件編譯為Svelte組件。 請參閱Svelte組件API的文檔 。

要生成一個定制元素，您需要將customelement: true傳遞給編譯器（在您的情況下，通過在傳遞給rollup-plugin-svelte的選項中進行設置）。 參見PR 797

Answer 2

從我這邊說來是錯誤的...

svelte({ include:'*.html'}) 

由於某種原因拼寫錯誤，將其刪除即可。