Skip to content

SSR - Named export 'Splide' not found. #109

@kinger251285

Description

@kinger251285

Checks

Version

0.6.12

Description

Hi

I am using Laravel, Vue, Inertia & Tailwind. This package is working great apart from server side rendering.

I am importing this package into my vue component like:

import { Splide, SplideSlide, SplideTrack } from '@splidejs/vue-splide';
import '@splidejs/vue-splide/css';

when i run php artisan inertia:start-ssr i get the below error:

file:///var/www/my-project/bootstrap/ssr/assets/Header-DnRd809i.js:4
import { Splide, SplideTrack, SplideSlide } from "@splidejs/vue-splide";
^^^^^^
SyntaxError: Named export 'Splide' not found. The requested module '@splidejs/vue-splide' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from '@splidejs/vue-splide';
const { Splide, SplideTrack, SplideSlide } = pkg;

at ModuleJob._instantiate (node:internal/modules/esm/module_job:146:21)
at async ModuleJob.run (node:internal/modules/esm/module_job:229:5)
at async ModuleLoader.import (node:internal/modules/esm/loader:473:24)
at async Promise.all (index 0)
at async L (file:///var/www/my-project/node_modules/@inertiajs/vue3/dist/index.esm.js:1:6040)
at async Server.<anonymous> (file:///var/www/my-project/node_modules/@inertiajs/core/dist/server.esm.js:1:527)

This is happening on every one of my VILT projects where i am using vue-splide.

Reproduction Link

No response

Steps to Reproduce

1.Create a new laravel project
2. Install this package via npm
3. Import it into a vue component
...

Expected Behaviour

SSR to run correctly.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions