Styles are not loaded in the Svelte example.

michal-damiecki commented 3 years ago

In the Svelte example, App.svelte contains some styling, for example, button styles and so on. Unfortunately, after running build and loading extension, it works fine but it doesn't load styles.

Svelte-extension

As far as I can see styles are not included in the /dist/popup/index.html:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <link rel="icon" href="../assets/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Svelte + TS + Vite App</title>
</head>

<body style="min-width:200px;">
    <div id="app"></div>
    <script type="module" src="./main.ts"></script>
</body>

</html>

salimldt commented 3 years ago

Same problem

francochau commented 3 years ago

will the css problem be fixed?

korzhanov commented 3 years ago

During development, you can temporarily enable cssCodeSplit parameter in the vite.config.js

build: {
    cssCodeSplit: true
    ...
}

https://vitejs.dev/config/#build-csscodesplit Your css will be rendered inside js

hubingliang commented 3 years ago

I tried this configuration and it worked for me ！

export default defineConfig({
    plugins: [
        svelte({
          emitCss: false
        }),
       ...
    ]
});

StarkShang / vite-plugin-chrome-extension

Styles are not loaded in the Svelte example. #7