Преобразование AST в UglifyJS

Я использую UglifyJS для анализа, минимизации и преобразования кодов JS. Одна из моих целей - преобразовать AST, вставив новые определения переменных. Например:

var x;
var y;
x = 1;
y = x;
x = 3;

Я хочу вставить новое определение переменной «var _x» в случайную позицию, например перед оператором «y = x». Преобразованный код должен быть таким:

var x;
var y;
x = 1;
var _x = x;
y = _x;
_x = 3;

Я пробовал TreeTransformer в UglifyJS. Обновить ссылку на символ, сделав ее новой (x -> _x), не проблема. Но мне неясно, как получить правильную позицию для вставки с помощью TreeTransformer. Кто-нибудь может поделиться некоторыми идеями? Некоторые примеры кода были бы лучше!


javascript transform abstract-syntax-tree uglifyjs
person Aliu    schedule 05.07.2015    source источник
comment
Объявления переменных имеют область видимости функции, и интерпретатор должен поднять их до начала функции, поэтому не имеет значения, куда вы вводите новое объявление, если оно находится в правильной области. Надеюсь, это полезная информация. Кроме того, это звучит как эксперимент с метаморфизмом в углификации javascript ... будь хорошим человеком.   -  person Catalyst    schedule 05.07.2015

Ответы (1)


arrow_upward
1
arrow_downward

Вот как я это решил.

var _ = require('lodash');
var path = require('path');
var Promise = require('bluebird');
var fs = Promise.promisifyAll(require('fs'));
var UglifyJS = require('uglify-js');

fs.readFileAsync(path.join(__dirname, 'source.js'), 'utf8').then(function (file) {
  var topLevel = UglifyJS.parse(file);

  var transformed = topLevel.transform(new UglifyJS.TreeTransformer(function (node, descend) {
    if (node instanceof UglifyJS.AST_Toplevel) {
      node = node.clone();

      // Add new variable declaration
      node.body.unshift(new UglifyJS.AST_Var({
        definitions: [
          new UglifyJS.AST_VarDef({
            name: new UglifyJS.AST_SymbolVar({
              name: '_x'
            })
          })
        ]
      }));

      // Replace existing assignment statement with new statements
      var index = _(node.body).findIndex(function (node) {
        return node instanceof UglifyJS.AST_SimpleStatement &&
          node.body instanceof UglifyJS.AST_Assign &&
          node.body.left instanceof UglifyJS.AST_SymbolRef &&
          node.body.left.name === 'y';
      });
      var assignmentStatement = node.body[index].clone();
      node.body.splice(
        index,
        1,
        new UglifyJS.AST_SimpleStatement({
          body: new UglifyJS.AST_Assign({
            left: new UglifyJS.AST_SymbolRef({name: '_x'}),
            operator: '=',
            right: new UglifyJS.AST_SymbolRef({name: 'x'})
          })
        }),
        new UglifyJS.AST_SimpleStatement({
          body: new UglifyJS.AST_Assign({
            left: assignmentStatement.body.left.clone(),
            operator: assignmentStatement.body.operator,
            right: new UglifyJS.AST_SymbolRef({name: '_x'})
          })
        })
      );

      descend(node, this);
      return node;
    }

    node = node.clone();
    descend(node, this);
    return node;
  }));

  var result = transformed.print_to_string({beautify: true});
  return fs.writeFileAsync(path.join(__dirname, 'output.js'), result);
});

Вот результат:

var _x;

var x;

var y;

x = 1;

_x = x;

y = _x;

x = 3;

Uglify поднимает объявления переменных в своем формате AST, поэтому я следую тому же правилу.

person Matthew King    schedule 05.07.2015