queenshow/vue.config.js

const { defineConfig } = require("@vue/cli-service");
const linariaLessLoader = require("@queenjs/webpack-loader/linaria-loader");
const modifyVars = require("./src/styles/theme-antd");
const path = require("path");

// const publicPath =
//   process.env.NODE_ENV === "production"
//     ? `//infishwaibao.oss-cn-chengdu.aliyuncs.com/cloud/v1/`
//     : "./";
const publicPath = "./";

module.exports = defineConfig({
  pages: {
    index: "src/pages/website/index.ts",
    editor: "src/pages/editor/index.ts",
  },
  publicPath: publicPath,
  transpileDependencies: true,
  chainWebpack: (config) => {
    const tsRule = config.module.rule("ts");
    tsRule
      .use("moduse-loader")
      .loader("moduse/webpack-loader")
      .options({
        include: [
          path.resolve(__dirname, "./src/modules"),
          path.resolve(__dirname, "./node_modules/@queenjs-modules"),
        ],
      });

    const tsxRule = config.module.rule("tsx");
    tsxRule.uses.store.delete("thread-loader");
    tsxRule
      .use("@linaria/webpack-loader")
      .loader("@linaria/webpack-loader")
      .options({
        // 将.css文件更名为.less
        extension: ".linaria.less",
        preprocessor: linariaLessLoader("@/styles/theme"),
      })
      .before("ts-loader");
  },
  css: {
    loaderOptions: {
      less: {
        lessOptions: {
          modifyVars,
          javascriptEnabled: true,
        },
      },
    },
  },
  pluginOptions: {
    windicss: {
      scan: {
        dirs: ["node_modules/@queenjs-modules"],
        fileExtensions: ["tsx"],
      },
      preflight: false,
      onOptionsResolved: (options) => {
        // make sure file @apply's get transformed
        options.scanOptions.extraTransformTargets = {
          css: [
            (f) => {
              if (/node_modules\\@queenjs-modules\\.+\.(css|less)/.test(f)) {
                return true;
              }
              return false;
            },
          ],
          detect: [],
        };
        return options;
      },
    },
  },
});