Missing styles when using vite build.

[jonocr]

When trying to build my app with vite build. The generated code won't include the styles of codemirror or any themes. It looks like in a previous version (5). There was the .css file on the dist folder of the module that devs could import directly but now there is no such file and vite is having difficulties bundling the styles.

here is how im importing the editor: import CodeMirror, { EditorView, basicSetup } from '@uiw/react-codemirror'; import { sql } from '@codemirror/lang-sql'; import { vscodeLight, vscodeLightInit } from '@uiw/codemirror-theme-vscode'; import { autocompletion, Completion, CompletionContext } from '@codemirror/autocomplete'; import { useEffect, useState } from 'react'; import { TableData } from '../../utils/utils'; import React from 'react'; import { LanguageSupport } from '@codemirror/language';

the version of the pacakges: "@codemirror/lang-sql": "^6.8.0", "@uiw/codemirror-theme-eclipse": "^4.23.6", "@uiw/codemirror-theme-vscode": "^4.23.6", "@uiw/react-codemirror": "^4.23.6", "codemirror": "^6.0.1", "vite": "^5.4.0"

Is there a work around this, so I can run the build and include the styles? Thanks for the help in advance

[EmersonVilar]

Hi @jonocr any improvements or answer?

[dvislov]

I've also lost all theme styles after the final packages update. Looks sad (

[dvislov]

@jonocr @EmersonVilar Hi guys, did you solve this issue somehow?

[dvislov]

BTW fixed by added this into vite.config.ts

resolve: {
    alias: {
      '@codemirror/state': path.resolve(__dirname, './node_modules/@codemirror/state/dist/index.cjs'),
      '@codemirror/view': path.resolve(__dirname, './node_modules/@codemirror/view/dist/index.cjs'),
      '@codemirror/language': path.resolve(__dirname, './node_modules/@codemirror/language/dist/index.cjs'),
    },
  },