Getting Error when using with react-ts

[yaldram]

• Hey thanks for this plugin, unfortunately I am facing an error here is my vite-config.ts

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import prismjs from "vite-plugin-prismjs";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    prismjs({
      languages: ["javascript"],
      plugins: [],
      theme: "twilight",
      css: false,
    }),
    react({
      babel: {
        plugins: [
          [
            "babel-plugin-styled-components",
            {
              displayName: true,
              fileName: false,
            },
          ],
          [
            "prismjs",
            {
              languages: ["javascript"],
              plugins: [],
              theme: "twilight",
              css: false,
            },
          ],
        ],
      },
    }),
  ],
});

I have the following dependencies - babel-plugin-prismjs, vite-plugin-prismjs.

My error -

[code-farmer-i]

Need to install dependency prismjs

[yaldram]

@code-farmer-i I do have it prismjs.

[yaldram]

I followed this - https://cdmana.com/2022/03/202203242042274722.html

[yaldram]

I got it working without this plugin also -

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    react({
      babel: {
        plugins: [
          [
            "babel-plugin-styled-components",
            {
              displayName: true,
              fileName: false,
            },
          ],
          [
            "prismjs",
            {
              languages: ["javascript"],
              plugins: [],
              theme: "twilight",
              css: false,
            },
          ],
        ],
      },
    }),
  ],
});

[yaldram]

This config worked -

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import prismjs from "vite-plugin-prismjs";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    react({
      babel: {
        plugins: [
          [
            "babel-plugin-styled-components",
            {
              displayName: true,
              fileName: false,
            },
          ],
          [
            "prismjs",
            {
              languages: ["javascript"],
              plugins: [],
              theme: "twilight",
              css: false,
            },
          ],
        ],
      },
    }),
    prismjs({
      languages: ["javascript"],
      plugins: [],
      theme: "twilight",
      css: false,
    }),
  ],
});

[yaldram]

@code-farmer-i Sir may I know the use of this plugin can I skip it, will it cause any problem.

[code-farmer-i]

I have only tried to use this plugin in a vue project