美文网首页
babel 简单插件

babel 简单插件

作者: antlove | 来源:发表于2021-03-19 19:57 被阅读0次

    package.json

    {
      "name": "babel-test",
      "version": "1.0.0",
      "main": "index.js",
      "license": "MIT",
      "devDependencies": {
        "@babel/core": "^7.13.10"
      }
    }
    

    要编译的原代码fun.js

    const c = '';
    

    babel 插件 plugin.js

    module.exports = function(babel) {
        const t = babel.types;
        return {
            visitor: {
                VariableDeclarator(path, state) {
                    // 使用a替换变量名c
                    if(path.node.id.name == 'c'){
                        path.node.id = t.identifier('a')
                    }
                    // 使用["any"]替换字符串字面量
                    if (t.isStringLiteral(path.node.init)) {
                        const element = t.stringLiteral('any');
                        path.node.init = t.arrayExpression([element]);
                    }
                }
            }
        }
    }
    

    编译文件index.js

    const babel = require('@babel/core');
    const pluginFunc = require('./plugin');
    const configItem = babel.createConfigItem(pluginFunc);
    const ret = babel.transformFileSync('fun.js', { plugins: [configItem], ast: true});
    console.log(ret.code);
    

    输出代码

    const a = ["any"];
    

    将code转化为AST节点在线查看器 AST explorer

    babel.types API

    相关文章

      网友评论

          本文标题:babel 简单插件

          本文链接:https://www.haomeiwen.com/subject/vqebcltx.html