手写loader看console是在哪个方法调用的
//name-console-loader.js
const parser = require('@babel/parser') const traverse = require('@babel/traverse').default const generator = require('@babel/generator').default const t = require('@babel/types') module.exports = function (source) { const ast = parser.parse(source, { sourceType: 'module' }); traverse(ast, { CallExpression(path) { const { callee, arguments } = path.node; if (t.isMemberExpression(callee) && callee.object.name === 'console' && callee.property.name === "log") { const parent = path.findParent(p => p.isFunctionDeclaration()); if (parent) { const fnName = parent.node.id.name arguments.unshift(t.stringLiteral(`${fnName}:`)); } } } }) const output = generator(ast, {}, source); return output.code; }
webpack loader配置,loader自右向左调,也就是从后往前调
{ test: /\.js$/i, use: [ { loader: 'babel-loader', options: { cacheDirectory: true } }, { loader: '../name-console-loader' } ], include: [path.resolve(__dirname, "app")], },

浙公网安备 33010602011771号