【前端Skill】点击目标元素定位跳转IDE中的源代码

参考：https://juejin.cn/post/7326002010084311079

快手开源项目：

https://github.com/zh-lx/code-inspector

目前在umi项目中用到

记录一下umi项目中如何使用

安装

npm i code-inspector-plugin -D --registry=https://registry.npmmirror.com/

配置

注意：动态引入时，要用解构的方式

Object [Module] {
  CodeInspectorPlugin: [Function: y],
  codeInspectorPlugin: [Function: y]
}

export default defineConfig({…..chainWebpack(memo) {if (process.env.NODE_ENV === 'development') {// 调试环境 动态引入code-inspector-pluginconst { codeInspectorPlugin } = require('code-inspector-plugin');memo.plugin('code-inspector-plugin').use(codeInspectorPlugin({bundler: 'webpack',}));}},……
});

使用

按住 shift + option + 点击目标元素