name: 'vite-plugin-xxx', load(id) { // 在钩子逻辑中可以通过闭包访问外部的 options 传参 } } } // 使用方式 // vite.config.ts import { myVitePlugin } from './myVitePlugin'; export default { plugins: [myVitePlugin({ /* 给插件传参 */ })] } 1. 2. 3. 4. 5. 6. 7. 8. ...
Then runnpm run devand visitlocalhost:5173/__inspect/to inspect the modules. Build Mode To inspect transformation in build mode, you can pass thebuild: trueoption: // vite.config.tsimportInspectfrom'vite-plugin-inspect'exportdefault{plugins:[Inspect({build:true,outputDir:'.vite-inspect'})],...
1 import { Plugin } from 'vite'; 2 import { Awaitable } from '@antfu/utils'; 3 import { StackFrame } from 'error-stack-parser-es'; 4 import { O as Options } from './shared/vite-plugin-inspect.6a105d51.js'; 5 import '@rollup/pluginutils'; ...
rollupPlugin()}})```大部分[Rollup插件](https://github.com/rollup/plugins/tree/master)可以直接使用在vite项目,但也要注意兼容性。更多[官方插件](https://cn.vitejs.dev/plugins/)、[社区插件](https://github.com/vitejs/awesome-vite#plugins)## 安装插件查看器`npm i -D vite-plugin-inspect`添加...
Inspect:Inspect 与 vite-plugin-inspect 集成,可以检查 Vite 的转换步骤。 Inspector:Inspector 与 vite-plugin-vue-inspector 集成,可以检查应用的 DOM 树,并查看渲染它的组件,这样可以更轻松地找到需要进行更改的位置。 独立窗口:Vue DevTools 可以作为一个独立的窗口运行,当你想在小屏幕上调试应用时,它非常有帮助...
用过babel-plugin-enhance-log 的肯定知道插件会自动打印 log 所在行,虽然说我在做 vite-plugin-enhance-log 的时候也可以拿到行数,但是由于输入代码已经被处理过一遍,导致跟真正的源码有所出入,可以通过 vite-plugin-inspect 看到效果: 然后我也没法拿到之前的 sourcemap,所以导致拿到代码行数有所出入 ...
To inspect transformation in build mode, you can pass the build: true option: // vite.config.ts import Inspect from 'vite-plugin-inspect' export default { plugins: [ Inspect({ build: true, outputDir: '.vite-inspect' }) ], } After running vite build, the inspector client will be gener...
vite-plugin-inspect/dist/index.mjs Version: 39 kBJavaScriptView Raw 1 import process from 'node:process'; 2 import sirv from 'sirv'; 3 import c from 'picocolors'; 4 import { dirname, resolve, isAbsolute, join } from 'node:path'; ...
PS: 在学习、调试或创作插件时,可以在项目中引入 vite-plugin-inspect。 它可以帮助你检查 Vite 插件的中间状态。安装后,你可以访问 localhost:3000/__inspect/ 来检查你项目的模块和栈信息。 插件的顺序 一个Vite 插件可以额外指定一个 enforce 属性来调整它的应用顺序。enforce 的值可以是pre 或post。解析后的...
请查阅 vite-plugin-inspect 文档 中的安装说明。 # 约定如果插件不使用 Vite 特有的钩子,可以作为 兼容Rollup 的插件 来实现,推荐使用 Rollup 插件名称约定。Rollup 插件应该有一个带 rollup-plugin-前缀、语义清晰的名称。 在package.json 中包含 rollup-plugin和vite-plugin关键字。