Skip to content

ERR_UNKNOWN_FILE_EXTENSION ".css" while using vite-ssg on SSR build (ol-contextmenu) #443

@kensongzhu

Description

@kensongzhu

Describe the bug

During the SSR build with vite-ssg, it can't properly resolve the css for ol-contextmenu; howerver, it can handle ol and ol-ext's ones
And following is the corresponding part vue3-openlayers.es.js in the node_modules

import "ol-contextmenu/ol-contextmenu.css"; // not work
//  import "ol-contextmenu/dist/ol-contextmenu.css"; // however if I patch above like this, it works 
import "ol-ext/dist/ol-ext.css";  
import "ol/ol.css";

There are similar issues in the vite-ssg for the other libraries e.g. vuetify

Affected version(s)

ol 10.6.1
ol-contextmenu 5.5.0
ol-ext 4.0.35
vue 3.5.22
vue3-openlayers 12.1.1

To Reproduce

Reproduction Link: https://stackblitz.com/edit/vue3-openlayers-template-k4iklxvp?file=vite.config.ts

In above reproduction, run npm run build

Expected behavior

Expect to import the true path of the ol-contextmenu/dist/ol-contextmenu.css

Screenshots

Image

Desktop (please complete the following information):

  • OS: Windows WSL2
  • Browser: chrome

Current Workaround

Have to set in vite.config.ts

  ssr: {
      noExternal: [
        'vue3-openlayers',
        'ol-contextmenu',
      ],
    }

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions