nguyenbatranvan / vite-multiple-assets

npm package
https://www.npmjs.com/package/vite-multiple-assets
8 stars 7 forks source link

Featuring Glob, Excluding Files, and Change Output #16

Open FarhanMS123 opened 1 month ago

FarhanMS123 commented 1 month ago

Hi! Thankyou for this plugin. It really fully have all I need.

Currently, I have different issues I want to solve. My case is I want to copy whole root project to output dir withoyt .git, and node_modules. The viteConfig.public can retrieve public files only by single directory, and I thought viteConfig.build.rollupOptions.external can be use to exclude these node_modules and .git from public listing. Unfortunately, I am wrong. So, I come to see this plugins and fully meet my objective.

In this PR, I add some major features:

I've test this on examples React and Solid and works also when dev mode.

But, this PR also has some issues or planned task:

nguyenbatranvan commented 1 month ago

Thanks for creating this PR!! I'm currently on a trip abroad, will watch it in the next few days!!

nguyenbatranvan commented 1 month ago

I'm quite impressed with what you contributed, would there be some further description of those changes? Now I have a look, and see the usage has changed with your PR

FarhanMS123 commented 1 month ago

Thankyou for your support. Perhaps I would tell my use case, and some tricky way that implemented by these features. At the beginning, my use case is copying the root project with ignoring some folders. I thought it could be done by Vite by using this way:

export default defineConfig({
  build: {
    rollupOptions: {
      external: [/\.git/ig, /node_modules/ig],
    },
  },
  publicDir: __dirname,
});

Unfortunately, the build.rollupOptions.external did not works by this reason. So, as I do not want to reinvent the wheel, I search many plugins on awesome awesome-vite and somewhere else on internet. And I comes to you. It meets my objective, and at first it works by what I want it to do. But I have some cases to fullfill, so I open this PR.


DynamicPublicDirectory(["**"], {
  ignore: [".git", "node_modules"],
})
import {PluginOption, defineConfig} from 'vite'
import DynamicPublicDirectory from "vite-multiple-assets";

export default defineConfig({
    root: __dirname,
    publicDir: false,
    plugins: [
       // this plugin must be put at last like after Vite or Svelte transformer
        DynamicPublicDirectory([], {
            ssr: false,
        }) as PluginOption,
    ],
})
assets/fonts/google-mui/roboto/roboto-mono.sft
+ assets/fonts/{\x01,google-mui}/**
= google-mui/roboto/roboto-mono.sft
DynamicPublicDirectory(["assets/fonts/{\x01,google-mui}/**"])

[!CAUTION] It MUST return a POSIX filepath, Slash rather than backslash\ RIGHT: dir1/dir2/file.txt RIGHT: C:/Windows/System32 WRONG: dir1\\dir2\\file.txt

import path from "path/posix"; // NOTE: use posix for relative transformation

// different folder
DynamicPublicDirectory(["public/**"], {
  dst: path.join(__dirname, ".cache"),
})
DynamicPublicDirectory(["public/**"], {
  dst: ({ dstFile, filepath, }) => filepath.match(/.jpg$/ig) ? false : undefined,
})
let nonce = false;

DynamicPublicDirectory(["public/**"], {
  dst: ({
    opts: {__dst, ...opts}, __files, // muttable
    dstFile, filepath, baseFile, // useful params to use
  }) => {
    if (!nonce) {
      __files["new-no/existing/file.png"] = "/home/me/Pictures/image.png"
      nonce = true;
    }
  }
})
export interface IConfigExtend extends Partial<Pick<Options, "ignore" | "dot">> {
    dst?: string | FDst;
}

export interface IConfig extends 
    IConfigExtend, 
    Partial<Pick<Options, "onlyFiles" | "onlyDirectories" | "cwd" | "markDirectories">> 
{
    __dst?: string; // NOTE: internal destination from parsing rollup write bundlers nor vite config.
    mimeTypes?: IMIME;
    ssr?: boolean;
}
({
  ignore: [],
  onlyFiles: true,
  onlyDirectories: false,
  markDirectories: true,
  dot: true,
  absolute: false, // ENFORCED
})
import path from "path/posix"; // NOTE: use posix for relative transformation

export type IAssets = string[] | string | (IConfigExtend & { assets: string | string[]; })[];

DynamicPublicDirectory([
  "public/**",
  {
    assets: "sample/**.txt",
    ignore: "**photo**"
  },
  {
    assets: ["assets/**", "vars/**"],
    dot: true,
    dst: path.join(__dirname, ".cache")
  },
], {
  dst: ({ dstFile, filepath, }) => filepath.match(/.jpg$/ig) ? false : undefined,
})
nguyenbatranvan commented 4 weeks ago

i tried running e2e for this PR!! It was successful, but there were too many changes from your PR. I need to look into it more closely