时间戳

首页 > 解决方案 > 页面捆绑不会通过 goto() 在路由上发送 css。仅提供 JS 捆绑包/块。仅在产品上发生

svelte - 页面捆绑不会通过 goto() 在路由上发送 css。仅提供 JS 捆绑包/块。仅在产品上发生

问题描述

我使用苗条的套件。我有多个页面。我的结构是这样的：

在此处输入图像描述

仅在产品上发生。如果我在一个页面上，并导航goto('register')到另一个页面，css 将不会加载并且不会被运送。只有在整个页面重新加载后，样式才会出现。但是，如果我通过 goto() 导航回来，其他组件/页面的样式就会消失，直到我刷新整个页面。

它看起来像什么风格。（包括 css 调用） 在此处输入图像描述

当我通过以下方式路由时的样子goto('register')：

在此处输入图像描述

如您所见，在常规路由中，没有发送用于注册的 .css 包。只有js。

我能做些什么 ？

还有我的 svelte.config.cjs

module.exports = {
    // Consult https://github.com/sveltejs/svelte-preprocess
    // for more information about preprocessors
    preprocess: sveltePreprocess({
        scss: {
            includePaths: ['src/styles/']
        }

    }),
    kit: {
        // By default, `npm run build` will create a standard Node app.
        // You can create optimized builds for different platforms by
        // specifying a different adapter
        adapter: node(),
        // hydrate the <div id="svelte"> element in src/app.html
        files: {
            hooks: 'src/hooks'
        },
        target: '#svelte',
        vite: {
            ssr: {
                noExternal: Object.keys(pkg.dependencies || {})
            },
        },
        ssr:false,
    }
};

不管有没有 ssr，都会出现这个问题。在开发上它按预期工作。

标签： sveltesveltekit

解决方案

问题是 svelte 套件的旧版本 ( 1.0.0-next.67)。 删除了节点模块和 package-lock.json，运行npm i，突然间，产品构建开始正常工作。现在它的版本1.0.0-next.95。

TL:DR 这是一个测试版错误，可以通过干净安装最新版本的 svelte 套件来解决。

推荐阅读