viteでlessをimportした際の inline JavaScript is not enabled. Is it set in your options? を解消する

viteでAntDesignのテーマのカスタマイズを行おうとしたときに

inline JavaScript is not enabled. Is it set in your options?

というエラーが表示されました。

調べてみると preprocessorのオプションに　javascriptEnabled: true を設定してあげないとダメそうです。

vite.config.js の設定変更

というわけで件の設定はviteでどうやってやるのって調べたら以下のように書けばいけるみたいでした

vite.config.js

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

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react(), tsconfigPaths()],
  server: {
    host: true,
  },
  // ↓を追加する
  css: {
    preprocessorOptions: {
      less: {
        javascriptEnabled: true,
      },
    },
  },
});