vite-plugin-api

一个分割全局api的vite插件

下载

    npm i @18mine/vite-plugin-api -D

用法

• 在vite.config.js中引用

    import { defineConfig } from 'vite';
    import ViteApi from '@18mine/vite-plugin-api';
    export default defineConfig({
        plugins: [
            ViteApi()
        ]
    });

• 在项目根目录下创建api.config.json文件

    {
        "url": "/", // url 为打包后api.config.js的访问路径

        // public为公用对象，vite构建时会将对象中每一项放进去
        "public": {
            "title": "@18Me"
        },
        "dev": {
            "api": "/"
        },
        "production": {
            "api": "/"
        }
    }

• 在package.json中使用

    // --mode 后传入的便是api.config.json中最外层对象的key值
    "scripts": {
        "dev": "vite --mode dev",
        "build": "vite build --mode production"
    }

• 生产环境会在src目录下生成api-plugin-config文件夹里面index.ts为所需文件

    export type AnyObject<T extends PropertyKey = PropertyKey, U = any> = Record<T, U>;
    export const api: AnyObject = {"api":"/","title":"欢迎来到@18Me的Vue3前端模板!!"};
    export const apiUrl: string = '/';

• 打包环境会在根目录目录下生成api.config.js文件,将数据存储在sessionStorage中

    const api = {"api":"/","title":"欢迎来到@18Me的Vue3前端模板!"};
    const apiUrl = '/';
    sessionStorage.setItem('api',JSON.stringify(api));
    sessionStorage.setItem('apiUrl',JSON.stringify(apiUrl));

参数配置

pathName

• type: string
• Default: 当前地动环境的根目录

    import { defineConfig } from 'vite';
    import ViteApi from '@18mine/vite-plugin-api';
    export default defineConfig({
        plugins: [
            ViteApi({ pathName: '/project' })
        ]
    });

License

MIT