vite-plugin-config-helper 0.0.9 → 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +23 -2
- package/dist/esm/main.js +1 -1
- package/dist/esm/types/main.d.ts +1 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -4,6 +4,17 @@
|
|
|
4
4
|
|
|
5
5
|
如果项目存在 build 目录，且包含 index.ts 或者 plugins.ts 文件， 则插件将不会更改 vite.config.ts 文件。
|
|
6
6
|
|
|
7
|
+
可以利用这个插件来整合之前写的 <span style="color: darkcyan;">vite-plugin-env-helper</span> 和 <span style="color: darkcyan;">vite-plugin-scan-routes</span> 插件，还可以拓展其他配置，例如 element-plus 组件，来快速搭建项目框架。
|
|
8
|
+
|
|
9
|
+
该插件只在项目初始搭建时起作用，搭建完成后会自动删除自身，所以不需要关注本库的大小及优化！
|
|
10
|
+
|
|
11
|
+
运行逻辑：
|
|
12
|
+
|
|
13
|
+
首先会判断在项目根目录下是否存在 /build/config/index.ts 或 /build/config/plugin.ts 文件，不存在则继续执行，
|
|
14
|
+
|
|
15
|
+
然后判断是否存在 .env 文件，并在该文件中以 VITE_APP_BASE_URL VITE_APP_PROXY_URL VITE_APP_PORT 这三个键承接插件传入参数 baseUrl proxyUrl port 。
|
|
16
|
+
|
|
17
|
+
在这个插件的开发过程中，不断添加的参数增加了复杂度，先是整合自己的两个插件，然后又想加 element-plus tailwindcss 等，边界的扩大导致了使用的复杂，最后决定整合 element-plus 然后稳定下来，这就已经可以实现比较全面的基础模板了。
|
|
7
18
|
## 安装
|
|
8
19
|
|
|
9
20
|
```bash
|
|
@@ -13,6 +24,12 @@ npm i -D vite-plugin-config-helper
|
|
|
13
24
|
## 使用
|
|
14
25
|
|
|
15
26
|
### 配置 <span style="color: darkcyan;">__vite.config.ts__</span>
|
|
27
|
+
|
|
28
|
+
1. 利用vue 或 vite 官方脚手架创建 vue 项目后，在 vite.config.ts 添加以下内容，然后执行命令 vite 。
|
|
29
|
+
|
|
30
|
+
2. 检查 package.json 文件，重新安装依赖。
|
|
31
|
+
|
|
32
|
+
3. 经过上面的操作，本插件会帮我们改造 vite.config.ts 配置文件，并将一些插件配置（element-plus）拆分到 /build/config 目录中，不用每次都去官网复制粘贴，能快速初始化一个干净的项目。
|
|
16
33
|
```ts
|
|
17
34
|
import vue from '@vitejs/plugin-vue'
|
|
18
35
|
import { defineConfig, type UserConfig, type ConfigEnv } from 'vite'
|
|
@@ -24,10 +41,14 @@ export default defineConfig((config: ConfigEnv): UserConfig => {
|
|
|
24
41
|
return {
|
|
25
42
|
plugins: [
|
|
26
43
|
vue(),
|
|
27
|
-
//
|
|
44
|
+
// 路由插件是自用的，感兴趣可自行查询，实现了 unplugin-vue-router 部分功能：约定式路由。
|
|
28
45
|
configHelper({
|
|
46
|
+
port: 5173,
|
|
29
47
|
baseUrl: '/api',
|
|
30
|
-
proxyUrl: 'http://192.168.0.193:9999'
|
|
48
|
+
proxyUrl: 'http://192.168.0.193:9999' ,
|
|
49
|
+
pluginEnvHelper: true,
|
|
50
|
+
pluginScanRoutes: false,
|
|
51
|
+
pluginElementPlus: true
|
|
31
52
|
})
|
|
32
53
|
]
|
|
33
54
|
}
|
package/dist/esm/main.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"node:fs";import n from"node:fs";import*as o from"node:path";import*as i from"node:os";async function
|
|
1
|
+
import*as e from"node:fs";import n from"node:fs";import*as o from"node:path";import*as i from"node:os";async function s(e){try{return await n.promises.access(e),!0}catch{return!1}}async function r(e,o){return await new Promise(((o,i)=>{let s="";n.createReadStream(e,{highWaterMark:1048576,encoding:"utf8"}).on("error",(e=>i(e))).on("data",(e=>s+=e)).on("end",(()=>{o(s)}))}))}async function t(e,o,i){return await new Promise(((i,s)=>{n.createWriteStream(e,{encoding:"utf8",highWaterMark:1048576}).on("error",(e=>s(e))).on("finish",(()=>i())).on("open",(function(){this.write(o),this.end()}))}))}function p(n={port:5173,baseUrl:"/api",proxyUrl:"http://192.168.0.193:9999",pluginEnvHelper:!1,pluginScanRoutes:!1,pluginElementPlus:!1}){return{name:"vite-plugin-config-helper",async configResolved(p){if(await s(o.resolve(process.cwd(),"./build/config/index.ts")))return;if(await s(o.resolve(process.cwd(),"./build/config/plugins.ts")))return;e.mkdirSync(process.cwd()+"/build/config",{recursive:!0});const l=await s(o.resolve(process.cwd(),"./.env")),c=["VITE_APP_BASE_URL","VITE_APP_PROXY_URL","VITE_APP_PORT"];if(!(c[0]in p.env))if(l){let e=await r(o.resolve(process.cwd(),"./.env"));e+=i.EOL+`VITE_APP_BASE_URL=${n.baseUrl}`,await t(o.resolve(process.cwd(),"./.env"),e)}else await t(o.resolve(process.cwd(),"./.env"),`VITE_APP_BASE_URL=${n.baseUrl}`);if(!(c[1]in p.env))if(await s(o.resolve(process.cwd(),"./.env"))){let e=await r(o.resolve(process.cwd(),"./.env"));e+=i.EOL+`VITE_APP_PROXY_URL=${n.proxyUrl}`,await t(o.resolve(process.cwd(),"./.env"),e)}else await t(o.resolve(process.cwd(),"./.env"),`VITE_APP_PROXY_URL=${n.proxyUrl}`);if(!(c[2]in p.env))if(await s(o.resolve(process.cwd(),"./.env"))){let e=await r(o.resolve(process.cwd(),"./.env"));e+=i.EOL+`VITE_APP_PORT=${n.port}`,await t(o.resolve(process.cwd(),"./.env"),e)}else await t(o.resolve(process.cwd(),"./.env"),`VITE_APP_PORT=${n.port}`);if(!await s(o.resolve(process.cwd(),"./build/config/plugins.ts"))){const e="import type { PluginsOption } from 'vite'\nimport vue from '@vitejs/plugin-vue'\nimport vueJsx from '@vitejs/plugin-vue-jsx'\nimport vueDevTools from 'vite-plugin-vue-devtools'"+i.EOL+(n.pluginScanRoutes?"import scanRoutes from 'vite-plugin-scan-routes'":"")+i.EOL+(n.pluginEnvHelper?"import { envHelper } from 'vite-plugin-env-helper'":"")+i.EOL+i.EOL+i.EOL+"export function createPlugins(): PluginsOption {\n const vitePlugins: PluginsOption = [\n vue(),\n vueJsx(),\n vueDevTools()"+(n.pluginScanRoutes?","+i.EOL+" scanRoutes()":"")+(n.pluginEnvHelper?","+i.EOL+" envHelper()"+i.EOL:"")+i.EOL+" ]\n return vitePlugins\n}\n";await t(o.resolve(process.cwd(),"./build/config/plugins.ts"),e)}if(n.pluginElementPlus&&!await s(o.resolve(process.cwd(),"./build/config/ep.ts"))){const e="import type { PluginsOption } from 'vite'\nimport AutoImport from 'unplugin-auto-import/vite'\nimport Components from 'unplugin-vue-components/vite'\nimport { ElementPlusResolver } from 'unplugin-vue-components/resolvers'"+i.EOL+i.EOL+"export function createElementPlusPlugins(): PluginsOption {\n const vitePlugins: PluginsOption = [\n AutoImport({\n dts: 'src/auto-imports.d.ts',\n imports: ['vue'],\n resolvers: [\n ElementPlusResolver({\n importStyle: 'css' \n })\n ]\n }),\n Components({\n dts: 'src/components.d.ts',\n dirs: [ 'src/components' ],\n resolvers: [\n ElementPlusResolver({\n importStyle: 'css' \n })\n ]\n })"+i.EOL+" ]\n return vitePlugins\n}\n";await t(o.resolve(process.cwd(),"./build/config/ep.ts"),e)}if(!await s(o.resolve(process.cwd(),"./build/config/index.ts"))){const e="import {"+i.EOL+" defineConfig as defineAppConfig,"+i.EOL+" mergeConfig,"+i.EOL+" loadEnv,"+i.EOL+" type UserConfig,"+i.EOL+" type ConfigEnv,"+i.EOL+" type PluginOption"+i.EOL+"} from 'vite'"+i.EOL+"import { createPlugins } from './plugins'"+(n.pluginElementPlus?i.EOL+"import { createElementPlusPlugins } from './ep'"+i.EOL:i.EOL)+"import { fileURLToPath, URL } from 'node:url'"+i.EOL+i.EOL+"interface ConfigOptions {"+i.EOL+" overrides?: UserConfig"+i.EOL+"}"+i.EOL+i.EOL+"export function defineConfig<T extends ConfigOptions>(options: T) {"+i.EOL+" const { overrides } = options"+i.EOL+" return defineAppConfig("+i.EOL+" (config: ConfigEnv): UserConfig => {"+i.EOL+" const prefixes = ['VITE_']"+i.EOL+" const env = loadEnv(config.mode, process.cwd(), prefixes)"+i.EOL+" const commonConfig: UserConfig = {"+i.EOL+" envPrefix: prefixes,"+i.EOL+" root: process.cwd(),"+i.EOL+" base: '/',"+i.EOL+" publicDir: 'public',"+i.EOL+" server: {"+i.EOL+" host: '0.0.0.0',"+i.EOL+" port: Number(env.VITE_APP_PORT),"+i.EOL+" proxy: {"+i.EOL+" [env.VITE_APP_BASE_URL]: {"+i.EOL+" target: env.VITE_APP_PROXY_URL,"+i.EOL+" changeOrigin: true,"+i.EOL+" rewrite: (path) => path.replace(new RegExp(`^${env.VITE_APP_BASE_URL}`), '')"+i.EOL+" }"+i.EOL+" }"+i.EOL+" },"+i.EOL+" resolve: {"+i.EOL+" alias: {"+i.EOL+" '@': fileURLToPath(new URL('../../src', import.meta.url))"+i.EOL+" }"+i.EOL+" },"+i.EOL+" plugins: ["+i.EOL+" ...createPlugins()"+(n.pluginElementPlus?","+i.EOL+" ...createElementPlusPlugins()"+i.EOL:i.EOL)+" ]"+i.EOL+" }"+i.EOL+" return overrides ? mergeConfig(commonConfig, overrides) : commonConfig"+i.EOL+" }"+i.EOL+" )"+i.EOL+"}"+i.EOL;await t(o.resolve(process.cwd(),"./build/config/index.ts"),e)}const u="import { defineConfig } from './build/config'"+i.EOL+i.EOL+"export default defineConfig({"+i.EOL+" overrides: {"+i.EOL+i.EOL+" }"+i.EOL+"})"+i.EOL;await t(o.resolve(process.cwd(),"./vite.config.ts"),u);const E=await r(o.resolve(process.cwd(),"./package.json"));let a="";n.pluginEnvHelper&&n.pluginScanRoutes?a=`"vite-plugin-env-helper": "^1.1.0",${i.EOL} "vite-plugin-scan-routes": "1.0.2",${i.EOL}`:n.pluginScanRoutes?a=`"vite-plugin-scan-routes": "1.0.2",${i.EOL}`:n.pluginEnvHelper&&(a=`"vite-plugin-env-helper": "^1.1.0",${i.EOL}`),n.pluginElementPlus&&(a+=`"unplugin-auto-import": "^19.3.0",${i.EOL} "unplugin-vue-components": "^28.8.0",${i.EOL}`);const v=E.replace(/"vite-plugin-config-helper":\s*"[^"]*"\s*,?\n?/g,a),g=n.pluginElementPlus?v.replace(/"dependencies": \s*\{/g,'"dependencies": {'+i.EOL+' "element-plus": "^2.10.4",'):v;await t(o.resolve(process.cwd(),"./package.json"),g)}}}export{p as configHelper};
|
package/dist/esm/types/main.d.ts
CHANGED