手写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")],
        },

 

posted @ 2025-09-12 11:13  你风致  阅读(4)  评论(0)    收藏  举报