samonxian / vite-plugin-build

Vite library mode plugin,which support transfom the whole folder and emit dceclaration files. Vite 库模式插件,支持整个文件夹的转换和声明文件生成。(支持 vanilla、react、vue3 和 svelte)
60 stars 6 forks source link

Change output folder #4

Closed Stunext closed 1 year ago

Stunext commented 2 years ago

Can I change the output folder?

I want dist folder like:

├── dist
|      ├── umd
|      ├── es
|      ├── lib.es.js
|      ├── lib.umd.js
|      └── style.css
├── node_modules
├── src 
├── package-lock.json
├── package.json
└── vite.config.js
samonxian commented 1 year ago

Mabe you can use below (use esOutputDir and commonOutDir),but folder mode is not support from umd format. You should use vite-plugin-build@0.6.1.

import path from 'path';
import { defineConfig } from 'vite';
import { buildPlugin } from 'vite-plugin-build';
import { svelte } from '@sveltejs/vite-plugin-svelte';
import { less, typescript } from 'svelte-preprocess';
import { cssModules, linearPreprocess } from 'svelte-preprocess-cssmodules';

export default defineConfig({
  plugins: [
    svelte({
      preprocess: linearPreprocess([
        // typescript 需要在这里设置开启
        typescript(), // 1 run first
        less(), // 2 run second
        // css module 在 vite 设置无效,需要在这里设置
        cssModules({
          localIdentName: 'rbac-[local]',
        }), // 3 run last
      ]),
    }),
    buildPlugin({
      fileBuild: {
        emitDeclaration: true,
        esOutputDir: 'dist/es',
        commonJsOutputDir: 'dist/lib',
      },
      libBuild: {
        buildOptions: {
          lib: {
            entry: path.resolve(__dirname, 'src/index.ts'),
            name: 'RbacComponents',
            fileName: (format) => `rbac-components.${format}.js`,
          },
        },
      },
    }),
  ],
});