Vite-run NPM | npm.io

vite 多配置执行支持, 配置共享，像搭积木一样自由组合配置，颗粒度精确到单字段配置。它可以完全替代vite.config,您无需在每个包中都创建一个vite.config配置该工具在pnpm 多包模式下开发

install

yarn

    yarn add vite -D
    yarn add vite-run -D

pnpm

    pnpm add vite -D
    pnpm add vite-run -D

Terminal commands

快速创建viterun.config配置模板， viterun将会自动识别当前是js或者ts项目并创建对应后缀的配置文件 options:

--init 在根目录创建模板配置文件
-f 创建配置模板时强制覆盖本地已存在配置，如果存在的话
-p 创建一个不包含使用注释的viterun.config文件
```
vite-run --init [? -f -p]
```

运行在targets配置中定义的配置名称，如果未指定appNames将运行包含该配置名称的所有配置，如果指定app名称则只会运行目标app的配置，appNames支持多个

vite-run [配置名称] [?appName1] [?appName2] ...

例如：

执行全部包含dev的配置，不指定app名称则默认找到所有app中包含dev的配置并执行
```
 vite-run dev
```
为 app 和 app2 执行dev配置, app名称没有限制个数
```
 vite-run dev app1 app2
```

Simple Demonstration

下方只是简单演示示例，并非完整配置，完整配置请见viterun.config.ts

dev dev

build build

manual-selection-app

viterun.config .js | .ts

viterun.config是在项目根目录下创建的配置文件，类似vite.config, 后缀可以是js或者ts

import { defineViteRunConfig } from "vite-run";
export default defineViteRunConfig({
  // baseConfig:{},
  // packages:[],
  // target:{},
  // other vite config block map
})

baseConfig

desc 用于共享的vite配置，所有的配置块都会和其合并作为最终配置信息

type Function | object

export default defineViteRunConfig({
   baseConfig:(options)=>{  // 使用函数形式，options包含子包信息，可以动态生成配置
      return {
        resolve: {
          extensions: [".ts",".js",'.vue'],
          alias: {
            "@": resolve(options.packagePath, 'src'),
         }
        },
        plugins: [
         // vue()
        ]
      }
   }
   // baseConfig：{}  直接使用对象形式
})

packages

desc 要进行管理的子包列表，支持glob与文件路径，glob匹配只支持末尾带*号

struct Array<string>

export default defineViteRunConfig{{
   packages: [
     'packages/*',
     'examples/vue3',
     './'     //  支持操作主包
   ]
}}

targets [ 配置块只能在这里使用, 配置块说明请看下方术语解释 ]

desc 定义配置名和其要运行的[配置块]或者[配置块组]
struct { appName: { scriptName :[ configName | Array<configName> ] }}
比如下方web-app中的 build 列表中存在两组配置： umd 是一个配置块，直接和baseConfig合并成最终配置。 ['es','production']是一个配置块组，会先将该组合并(配置重叠会以后面配置为主)成同一个配置之后，再和baseConfig合并成最终配置。
```
    export default defineViteRunConfig({
      targets: {
        'lib-app':{
           dev: ['watch']
        },
        'web-app': {
           build: [
             ['es','production'],  // 配置块组
             ['umd']
           ],
           dev:[
             ['10000']
           ]
        },
      },
    })
    ```
```

Other vite config block map

vite.config 和 viterun.config针对配置vite配置是存在区别的 : viterun在原本vite的配置上使用一个对象包裹起来，为每个vite配置块命名，原本的vite配置则作为该键名的值

// vite 配置结构
export default defineViteRunConfig({
  build: {
    lib: {
       formats: ['es']
    },
    watch: {},
  },
  server: {
    port: 10000
  },
})
//--------------------------------------------
// viterun 配置结构
export default defineViteRunConfig({
  build: {
    es:{     // 支持使用对象形式
      lib:{
         formats: ['es']
       }
    },
    es:(options)=> {  // 支持函数形式返回，options包含子包信息
      return {
        lib: {
          formats: ['es']
        }
      }
    },
    watch: {
      watch:{}
    },
  },
  server: {
    10000: {
      port: 10000
    },
  },
})

viteRunLogPlugin

您如果需要管控和优化控制台输出信息，viterun内置了一个viteRunLogPlugin插件该插件能控制vite默认日志输出和 viterun工具的日志输出您可以直接导入使用，配置和使用信息请自行点击编辑器链接到d.ts文件中查看

import { viteRunLogPlugin } from 'vite-run'

interceptStdoutWriteLog

如果您有拦截其他日志输出的需求，你可以使用interceptStdoutWriteLog函数, 该插件能控制和拦截所有输出到控制台的字符串流信息

import { interceptStdoutWriteLog } from 'vite-run'
interceptStdoutWriteLog((log)=>{
    console.warn(log)  // 如果console.log用不了，请使用console.warn
    // 返回 true 表示输出该日志，返回false表示不输出该日志，
    // 如果想修改日志，直接返回false，然后console.warn手动输出就行
    return true
})

术语解释

配置块：比如下面配置中 es 就是配置块名称， es对应的值便是原本vite配置的build对象，配置块也可以叫做vite配置块，指的就是vite配置中的一小部分，并为其取名方便后面自由组合配置
```
export default defineViteRunConfig({
  build: {
    es: {
      lib: {
        formats: ['umd']
      },
    }
  }
})
```
配置名称：比如下方的dev就是配置名称，里面包含多个vite配置块， dev数组里面每个数组成员(配置块组)最终都会生成一个独立的vite配置
```
export default defineViteRunConfig({
   targets: {
     'lib-app':{
        dev: [
          ['watch','es'],
        ]
     },
   }
 })
```