domagic-webpack-plugin
v1.1.27
Published
A development-only Webpack plugin for DOM source mapping and AI-assisted style edits.
Maintainers
Readme
domagic-webpack-plugin
DOMagic 的 Webpack 适配插件。它复用 domagic-vite-plugin 中已经沉淀的核心能力:
- React / Vue DOM 元数据注入
- DOMagic runtime 浮层
- AI 修改样式接口
- Git 提交面板接口
- 本地规则 runner 与 CLI runner
这个包只负责 Webpack 外壳适配,不修改 Vite 版本的插件逻辑。
安装
npm install -D domagic-webpack-plugin domagic-vite-plugin需要配合 html-webpack-plugin 注入 runtime:
npm install -D html-webpack-plugin使用
import HtmlWebpackPlugin from 'html-webpack-plugin'
import { DOMagicWebpackPlugin } from 'domagic-webpack-plugin'
export default {
mode: 'development',
plugins: [
new HtmlWebpackPlugin({ template: './index.html' }),
new DOMagicWebpackPlugin({
pathMode: 'relative',
}),
],
devServer: {
port: 3000,
},
}工作方式
- 开发模式下自动插入一个
preloader,处理.jsx、.tsx、.vue文件。 - 通过
html-webpack-plugin的 hooks 注入 DOMagic runtime。 - 通过
devServer.setupMiddlewares挂载 DOMagic 本地接口。 - 生产模式
mode: 'production'下默认不启用。
选项
支持与 Vite 插件一致的基础配置:
new DOMagicWebpackPlugin({
pathMode: 'relative',
root: process.cwd(),
agent: {
provider: 'codex',
},
})也可以显式关闭:
new DOMagicWebpackPlugin({
enabled: false,
})