feat: add asset options into build options (#53)

src/node/build.ts

@@ -15,7 +15,7 @@ import { Options } from 'rollup-plugin-vue'
 import { createBuildResolvePlugin } from './buildPluginResolve'
 import { createBuildHtmlPlugin, scriptRE } from './buildPluginHtml'
 import { createBuildCssPlugin } from './buildPluginCss'
-import { createBuildAssetPlugin } from './buildPluginAsset'
+import { AssetsOptions, createBuildAssetPlugin } from './buildPluginAsset'
 import { isExternalUrl } from './utils'
 
 export interface BuildOptions {
@@ -42,6 +42,10 @@ export interface BuildOptions {
    * Defaults to `assets`
    */
   assetsDir?: string
+  /**
+   * The option with process assets. eg.image
+   */
+  assetsOptions?: AssetsOptions
   /**
    * List files that are included in the build, but not inside project root.
    * e.g. if you are building a higher level tool on top of vite and includes
@@ -107,6 +111,7 @@ export async function build(options: BuildOptions = {}): Promise<BuildResult> {
     cdn = !resolveVue(root).hasLocalVue,
     outDir = path.resolve(root, 'dist'),
     assetsDir = 'assets',
+    assetsOptions = {},
     resolvers = [],
     srcRoots = [],
     rollupInputOptions = {},
@@ -185,9 +190,9 @@ export async function build(options: BuildOptions = {}): Promise<BuildResult> {
         __DEV__: 'false'
       }),
       // vite:css
-      createBuildCssPlugin(root, assetsDir, cssFileName, minify),
+      createBuildCssPlugin(root, assetsDir, cssFileName, minify, assetsOptions),
       // vite:asset
-      createBuildAssetPlugin(assetsDir),
+      createBuildAssetPlugin(assetsDir, assetsOptions),
       // minify with terser
       // modules: true and toplevel: true are implied with format: 'es'
       ...(minify ? [require('rollup-plugin-terser').terser()] : [])

src/node/buildPluginAsset.ts

@@ -8,18 +8,27 @@ import mime from 'mime-types'
 
 const debug = require('debug')('vite:build:asset')
 
-// TODO make this configurable
-const inlineThreshold = 4096
+export interface AssetsOptions {
+  inlineThreshold?: number
+}
+
+const defaultAssetsOptions: AssetsOptions = {
+  inlineThreshold: 4096
+}
 
-export const getAssetPublicPath = async (id: string, assetsDir: string) => {
+export const getAssetPublicPath = async (
+  id: string,
+  assetsDir: string,
+  assetsOptions: AssetsOptions
+) => {
   const ext = path.extname(id)
   const baseName = path.basename(id, ext)
   const resolvedFileName = `${baseName}.${hash_sum(id)}${ext}`
 
   let url = slash(path.join('/', assetsDir, resolvedFileName))
   const content = await fs.readFile(id)
   if (!id.endsWith(`.svg`)) {
-    if (content.length < inlineThreshold) {
+    if (content.length < assetsOptions.inlineThreshold!) {
       url = `data:${mime.lookup(id)};base64,${content.toString('base64')}`
     }
   }
@@ -45,16 +54,20 @@ export const registerAssets = (
   }
 }
 
-export const createBuildAssetPlugin = (assetsDir: string): Plugin => {
+export const createBuildAssetPlugin = (
+  assetsDir: string,
+  assetsOptions: AssetsOptions
+): Plugin => {
   const assets = new Map()
-
+  assetsOptions = { ...defaultAssetsOptions, ...assetsOptions }
   return {
     name: 'vite:asset',
     async load(id) {
       if (isStaticAsset(id)) {
         const { fileName, content, url } = await getAssetPublicPath(
           id,
-          assetsDir
+          assetsDir,
+          assetsOptions
         )
         assets.set(fileName, content)
         debug(`${id} -> ${url}`)

src/node/buildPluginCss.ts

@@ -1,6 +1,10 @@
 import path from 'path'
 import { Plugin } from 'rollup'
-import { getAssetPublicPath, registerAssets } from './buildPluginAsset'
+import {
+  AssetsOptions,
+  getAssetPublicPath,
+  registerAssets
+} from './buildPluginAsset'
 import { loadPostcssConfig } from './config'
 import { isExternalUrl } from './utils'
 
@@ -12,7 +16,8 @@ export const createBuildCssPlugin = (
   root: string,
   assetsDir: string,
   cssFileName: string,
-  minify: boolean
+  minify: boolean,
+  assetsOptions: AssetsOptions
 ): Plugin => {
   const styles: Map<string, string> = new Map()
   const assets = new Map()
@@ -40,7 +45,8 @@ export const createBuildCssPlugin = (
             const file = path.join(fileDir, rawUrl)
             const { fileName, content, url } = await getAssetPublicPath(
               file,
-              assetsDir
+              assetsDir,
+              assetsOptions
             )
             assets.set(fileName, content)
             debug(`url(${rawUrl}) -> url(${url})`)