Strapi v5 Compatability

[burakozdemir32]

Hey! It seems the plugin won't be compatible with the new version of Strapi. I've received the following error while testing it out on beta.

strapi:build: [ERROR] There seems to be an unexpected error, try again with --debug for more information strapi:build: strapi:build: ┌─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┐│ ││ RollupError: [commonjs--resolver] Expression expected in /Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/@[email protected]_@ckeditor+cked ││ [email protected]_@ckeditor+ckeditor5-e_witlk4ebgabtwjzhyd4665qjgy/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/index.js ││ file: /Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_witlk4ebgab ││ twjzhyd4665qjgy/node_modules/@ckeditor/strapi-plugin-ckeditor/strapi-admin.js:26:10 ││ 24: icon: () => { ││ 25: return ( ││ 26: <IconBox justifyContent="center" alignItems="center" width={ 7 } height={ 6 } hasRadius aria-hidden> ││ ^ ││ 27: <Icon as={ CKEditorIcon } /> ││ 28: </IconBox> ││ at getRollupError (file:///Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/parseAst.js:394:41) ││ at convertProgram (file:///Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/parseAst.js:1058:26) ││ at parseAst (file:///Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/parseAst.js:2202:12) ││ at tryParse (file:///Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-jvB8WLp9.js:7666:12) ││ at analyzeTopLevelStatements ││ (file:///Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-jvB8WLp9.js:7686:15) ││ at Object.transformAndCheckExports ││ (file:///Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-jvB8WLp9.js:9734:68) ││ at Object.transform ││ (file:///Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/vite/dist/node/chunks/dep-jvB8WLp9.js:9934:41) ││ at file:///Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/node-entry.js:19778:40 ││ │└─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┘ strapi:build:  ELIFECYCLE  Command failed with exit code 1.

[Mgsy]

Hey @burakozdemir32! Thanks for the report, I will check it.

[burakozdemir32]

Hey @Mgsy 👋 Thanks for looking into it 🙌 After some digging, the error message has changed a bit:

✘ [ERROR] The JSX syntax extension is not currently enabled

    ../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/index.js:26:10:
      26 │           <IconBox justifyContent="center" alignItems="center" width={ 7 } height={ 6 } hasRadius aria-hidden>
         ╵           ^

  The esbuild loader for this file is currently set to "js" but it must be set to "jsx" to be able
  to parse JSX syntax. You can use "loader: { '.js': 'jsx' }" to do that.

✘ [ERROR] Could not resolve "@strapi/helper-plugin"

    ../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/index.js:1:41:
      1 │ import { prefixPluginTranslations } from '@strapi/helper-plugin';
        ╵                                          ~~~~~~~~~~~~~~~~~~~~~~~

  You can mark the path "@strapi/helper-plugin" as external to exclude it from the bundle, which
  will remove this error and leave the unresolved path in the bundle.

✘ [ERROR] Could not resolve "@strapi/design-system/Icon"

    ../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/index.js:6:21:
      6 │ import { Icon } from '@strapi/design-system/Icon';
        ╵                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  You can mark the path "@strapi/design-system/Icon" as external to exclude it from the bundle,
  which will remove this error and leave the unresolved path in the bundle.

✘ [ERROR] Could not resolve "@strapi/design-system/Flex"

    ../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/index.js:7:21:
      7 │ import { Flex } from '@strapi/design-system/Flex';
        ╵                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  You can mark the path "@strapi/design-system/Flex" as external to exclude it from the bundle,
  which will remove this error and leave the unresolved path in the bundle.

✘ [ERROR] The JSX syntax extension is not currently enabled

    ../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/CKEditorIcon.js:4:2:
      4 │   <svg xmlns="http://www.w3.org/2000/svg" viewBox="-15 -7 50 37" { ...props }>
        ╵   ^

  The esbuild loader for this file is currently set to "js" but it must be set to "jsx" to be able
  to parse JSX syntax. You can use "loader: { '.js': 'jsx' }" to do that.

✘ [ERROR] The JSX syntax extension is not currently enabled

    ../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/components/CKEditorInput/index.js:64:4:
      64 │     <Field
         ╵     ^

  The esbuild loader for this file is currently set to "js" but it must be set to "jsx" to be able
  to parse JSX syntax. You can use "loader: { '.js': 'jsx' }" to do that.

✘ [ERROR] Could not resolve "@strapi/design-system/Stack"

    ../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/components/CKEditorInput/index.js:3:22:
      3 │ import { Stack } from '@strapi/design-system/Stack';
        ╵                       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  You can mark the path "@strapi/design-system/Stack" as external to exclude it from the bundle,
  which will remove this error and leave the unresolved path in the bundle.

✘ [ERROR] Could not resolve "@strapi/design-system/Field"

    ../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/components/CKEditorInput/index.js:4:57:
      4 │ import { Field, FieldHint, FieldError, FieldLabel } from '@strapi/design-system/Field';
        ╵                                                          ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  You can mark the path "@strapi/design-system/Field" as external to exclude it from the bundle,
  which will remove this error and leave the unresolved path in the bundle.

✘ [ERROR] The JSX syntax extension is not currently enabled

    ../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/components/MediaLib/index.js:24:4:
      24 │     <MediaLibraryDialog onClose={ onToggle } onSelectAssets={ handleSelectAssets } />
         ╵     ^

  The esbuild loader for this file is currently set to "js" but it must be set to "jsx" to be able
  to parse JSX syntax. You can use "loader: { '.js': 'jsx' }" to do that.

✘ [ERROR] Could not resolve "@strapi/helper-plugin"

    ../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/components/MediaLib/index.js:2:56:
      2 │ import { prefixFileUrlWithBackendUrl, useLibrary } from '@strapi/helper-plugin';
        ╵                                                         ~~~~~~~~~~~~~~~~~~~~~~~

  You can mark the path "@strapi/helper-plugin" as external to exclude it from the bundle, which
  will remove this error and leave the unresolved path in the bundle.

1:53:50 PM [vite] error while updating dependencies:
Error: Build failed with 10 errors:
../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/CKEditorIcon.js:4:2: ERROR: The JSX syntax extension is not currently enabled
../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/components/CKEditorInput/index.js:3:22: ERROR: Could not resolve "@strapi/design-system/Stack"
../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/components/CKEditorInput/index.js:4:57: ERROR: Could not resolve "@strapi/design-system/Field"
../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/components/CKEditorInput/index.js:64:4: ERROR: The JSX syntax extension is not currently enabled
../../node_modules/.pnpm/@[email protected]_@[email protected]_@ckeditor+ckeditor5-e_snpklurq764mj2kbmhrnbfgcym/node_modules/@ckeditor/strapi-plugin-ckeditor/admin/src/components/MediaLib/index.js:2:56: ERROR: Could not resolve "@strapi/helper-plugin"
...
    at failureErrorWithLog (/Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/[email protected]/node_modules/esbuild/lib/main.js:1651:15)
    at /Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/[email protected]/node_modules/esbuild/lib/main.js:1059:25
    at /Users/burakozdemir/repos/taxify/web-cms/node_modules/.pnpm/[email protected]/node_modules/esbuild/lib/main.js:1527:9
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)

[burakozdemir32]

Hey @Mgsy 👋 Could you give any ETA o this?