使用 Svelte：如何将组件样式放在单独的文件中，但仍限定在该组件范围内

Question

我正在开发一个 table 组件，该组件将在我的任何项目中可用（当它正常工作时包含在库中）。由于有很多 css 规则与此组件相关，我想将样式放在组件 svelte 文件之外。我所做的是编写一个单独的 css 文件，我通过 :

在组件 svelte 文件中导入该文件

import './table.css';

但在这种情况下，我可以在构建的 bundle.css 文件中看到我的规则，但这些规则不在我的组件范围内。所以我想知道是否有办法按照我的意愿去做....

Answer 1

yes, when svelte-preprocess is set up, you can use <style src="./table.css"></style> in the .svelte file https://github.com/sveltejs/svelte-preprocess#external-files

...https://discord.com/channels/457912077277855764/945368391231864832/945369571680997416

使用 Svelte：如何将组件样式放在单独的文件中，但仍限定在该组件范围内

With Svelte : How to put component style in a separated file but still scoped to this component

css

components

scope

rules

svelte-3