source-inspector

• Inspect html elements' source code in IDE

npm install source-inspector --save-dev

Note!!

You may need to install the launch command line of your IDE

• For webstorm
• For vscode

Webpack（version 4 or 5）

const SourceInspectorWebpackPlugin = require('source-inspector/webpack')

module.exports = {
  entry: 'index.js',
  output: {
    path: __dirname + '/dist',
    filename: 'index_bundle.js'
  },
  plugins: [
    new SourceInspectorWebpackPlugin({
        hotKey: "Alt" // trigger inspector
    })
  ]
}

Vite

import SourceInspectorPlugin from "source-inspector/vite";

export default defineConfig({
  plugins: [SourceInspectorPlugin()]
});

Support react and vue