Support Source Maps

[HaNdTriX]

Using this plugin with vite, logs the following warning when running vite build

Sourcemap is likely to be incorrect: a plugin (vite-ckeditor5-styles-loader) was used to transform files, but didn't generate a sourcemap for the transformation. Consult the plugin documentation for help

More info

• https://vitejs.dev/guide/api-plugin.html#transforming-custom-file-types
• https://github.com/ckeditor/vite-plugin-ckeditor5/blob/master/src/loaders/stylesLoader.ts#L61-L63

[Witoso]

TBH I have not observed that in vite build. What build configuration do you have?

[HaNdTriX]

The warning pops up as soon as sourcemaps are enabled. Here is my

vite.config.ts

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import ckeditor5 from "@ckeditor/vite-plugin-ckeditor5";
import { createRequire } from "node:module";

const require = createRequire(import.meta.url);

// https://vitejs.dev/config/
export default defineConfig({

  build: {
    // The issue happens when the sourcemap is enabled (true | 'hidden' | 'inline').
    sourcemap: true, // <- 🐞
  },

  // TODO: Remove this fix once the following issue is resolved:
  // https://github.com/ckeditor/ckeditor5/issues/13922
  optimizeDeps: {
    esbuildOptions: {
      legalComments: "none",
    },
  },
  plugins: [
    vue(),
    ckeditor5({ theme: require.resolve("@ckeditor/ckeditor5-theme-lark") }),
  ],
});

package.json

{
  "name": "ck-sourcemap-issue",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vue-tsc && vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "@ckeditor/ckeditor5-alignment": "^37.1.0",
    "@ckeditor/ckeditor5-autoformat": "^37.1.0",
    "@ckeditor/ckeditor5-basic-styles": "^37.1.0",
    "@ckeditor/ckeditor5-block-quote": "^37.1.0",
    "@ckeditor/ckeditor5-ckbox": "^37.1.0",
    "@ckeditor/ckeditor5-cloud-services": "^37.1.0",
    "@ckeditor/ckeditor5-comments": "^37.1.0",
    "@ckeditor/ckeditor5-editor-classic": "^37.1.0",
    "@ckeditor/ckeditor5-essentials": "^37.1.0",
    "@ckeditor/ckeditor5-font": "^37.1.0",
    "@ckeditor/ckeditor5-heading": "^37.1.0",
    "@ckeditor/ckeditor5-highlight": "^37.1.0",
    "@ckeditor/ckeditor5-image": "^37.1.0",
    "@ckeditor/ckeditor5-link": "^37.1.0",
    "@ckeditor/ckeditor5-list": "^37.1.0",
    "@ckeditor/ckeditor5-media-embed": "^37.1.0",
    "@ckeditor/ckeditor5-paragraph": "^37.1.0",
    "@ckeditor/ckeditor5-paste-from-office": "^37.1.0",
    "@ckeditor/ckeditor5-real-time-collaboration": "^37.1.0",
    "@ckeditor/ckeditor5-remove-format": "^37.1.0",
    "@ckeditor/ckeditor5-table": "^37.1.0",
    "@ckeditor/ckeditor5-theme-lark": "^37.1.0",
    "@ckeditor/ckeditor5-track-changes": "^37.1.0",
    "@ckeditor/ckeditor5-vue": "^5.1.0",
    "@types/node": "^20.2.3",
    "ckbox": "^1.5.0",
    "vue": "^3.2.47"
  },
  "devDependencies": {
    "@ckeditor/vite-plugin-ckeditor5": "^0.1.1",
    "@vitejs/plugin-vue": "^4.1.0",
    "typescript": "^5.0.2",
    "vite": "^4.3.2",
    "vue-tsc": "^1.4.2"
  }
}

[Witoso]

@LukaszGudel is this something you could tweak?

[HaNdTriX]

Short reproduction instructions

To reproduce this issue just add the following to your vite.config.ts and run vite build:

  ...
+  build: {
+    sourcemap: true
+  },
  ...

[LukaszGudel]

The issue with warnings was fixed in #9 and will be available in the next release of the plugin.

[HaNdTriX]

@LukaszGudel Thanks a lot for fixing this issue 🙏. Is there already a release date? It would be awesome if we could use these changes.

[LukaszGudel]

@HaNdTriX We just released version 0.1.2 which includes the fix to your issue.

[HaNdTriX]

Thanks a lot! 🙏