暂无图片
暂无图片
暂无图片
暂无图片
暂无图片

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

Nephilim 2024-06-06
177

Tips:一些记录,一些笔记



2024/06/06

THURSDAY

Life is like an onion:

You peel it one layer only open, sometimes you have to shed tears.


生活就像洋葱头:

你只能一层一层地把它剥开,有时你还得流泪。



01

错误描述


该错误发生在用「Vite」构建的「Vue.JS 3」项目的运行过程中。


发生该错误的时候,你看到的可能是这样的现场:

    [plugin:vite:css] [less] Inline JavaScript is not enabled. Is it set in your options?
    /Users/adamhuan/PycharmProjects/django_daily_media_frontend/node_modules/@surely-vue/table/src/style/color/bezierEasing.less:110:0
    108| // resolve error: `ReferenceError: colorPalette is not defined`
    109| // https://github.com/ant-design/ant-motion/issues/44
    110| .bezierEasingMixin();
    | ^
    111|
    at process (file:///Users/adamhuan/PycharmProjects/django_daily_media_frontend/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:33035:41)
    at async compileCSSPreprocessors (file:///Users/adamhuan/PycharmProjects/django_daily_media_frontend/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:32139:30)
    at async compileCSS (file:///Users/adamhuan/PycharmProjects/django_daily_media_frontend/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:32189:36)
    at async TransformContext.transform (file:///Users/adamhuan/PycharmProjects/django_daily_media_frontend/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:31583:56)
    at async file:///Users/adamhuan/PycharmProjects/django_daily_media_frontend/node_modules/vite-plugin-inspect/dist/index.mjs:377:17
    at async Object.transform (file:///Users/adamhuan/PycharmProjects/django_daily_media_frontend/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:51139:30)
    at async loadAndTransform (file:///Users/adamhuan/PycharmProjects/django_daily_media_frontend/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:53894:29)
    at async viteTransformMiddleware (file:///Users/adamhuan/PycharmProjects/django_daily_media_frontend/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:63743:32


    02

    错误解决

    在文件「vite.config.js」中配置JavaScript支持:


    该文件修复后的完整内容如下:

      // Node.JS
      import { fileURLToPath, URL } from 'node:url'


      // Vite
      import { defineConfig, loadEnv } from 'vite'


      // Vue.JS
      import vue from '@vitejs/plugin-vue'
      import vueJsx from '@vitejs/plugin-vue-jsx'
      import VueDevTools from 'vite-plugin-vue-devtools'


      // Path
      import path from 'path'


      // 自动按需引入组件
      import Components from 'unplugin-vue-components/vite'
      import AutoImport from 'unplugin-auto-import/vite'


      import {AntDesignVueResolver, AntDesignVueResolverOptions} from "unplugin-vue-components/dist/resolvers";
      import {ArcoResolver} from "unplugin-vue-components/dist/resolvers";


      // Vite Config
      // https://vitejs.dev/config/
      export default defineConfig((config) => {


      // 变量设置
      const { command, mode } = config
      const env = loadEnv(mode, process.cwd(), '')


      // 代理记录
      const proxies = {
      // 第一条代理
      [env.VITE_APP_BASE_API]: {
      target: env.VITE_APP_SERVICE_API,
      changeOrigin: true,
      rewrite:(path:any) => path.replace(
      new RegExp("^" + env.VITE_APP_BASE_API),
      ""
      ),
      },
      // 其他代理
      "/auth": {
      target: "http://localhost:8000/auth",
      changeOrigin: true,
      rewrite:(path:any) => path.replace(
      new RegExp("^/auth"),
      ""
      ),
      },
      // 其他代理
      "/jwt": {
      target: "http://localhost:8000/jwt",
      changeOrigin: true,
      rewrite:(path:any) => path.replace(
      new RegExp("^/jwt"),
      ""
      ),
      },
      // 其他代理
      "/collects": {
      target: "http://localhost:8000/collects",
      changeOrigin: true,
      rewrite:(path:any) => path.replace(
      new RegExp("^/collects"),
      ""
      ),
      },
      }


      return {


      // plugins
      plugins: [


      // Vue.JS
      vue(),
      vueJsx(),
      VueDevTools(),


      // 自动按需引入组件
      AutoImport({
      resolvers: [
      ArcoResolver(),
      ]
      }),
      Components({
      resolvers: [
      AntDesignVueResolver({
      importStyle: false, // css in js
      }),
      ArcoResolver({
      sideEffect: true
      }),
      ]
      }),


      ],


      // resolve
      resolve: {
      alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
      // '@': path.resolve(__dirname, './src'),
      },
      },


      // css
      css: {
      preprocessorOptions: {
      less: {
      javascriptEnabled: true
      }
      }
      },


      // server
      server: {
      host: "0.0.0.0",
      port: Number(env.VITE_APP_PORT),
      // open: true,
      // 代理设置
      proxy: proxies,
      },


      }
      })






      END




      温馨提示



      如果你喜欢本文,请分享到朋友圈,想要获得更多信息,请关注我。


      文章转载自Nephilim,如果涉嫌侵权,请发送邮件至:contact@modb.pro进行举报,并提供相关证据,一经查实,墨天轮将立刻删除相关内容。

      评论