babelify 转换不是运行

Question

我无法在我的代码中使用 babelify 运行。

我有两个打字稿文件：

script1.ts

import Greeter from './script2';

const greeter = new Greeter('Hello, world!');

document.body.innerHTML = greeter.greet();

script2.ts

class Greeter {
    greeting: string;

    constructor(msg: string) {
        this.greeting = msg;
    }

    greet() {
        return `<h1>${this.greeting}</h1>`;
    }
}

export default Greeter;

.babelrc

{
  "presets": [
      "airbnb"
  ]
}

我正在尝试运行使用 tsify 和 babelify 浏览器：

browserify ./script1.ts -o ./app.js -p tsify -t babelify

文件被编译和打包，但它从未运行对代码进行 babelify，我最终得到的输出仍然包含类和模板字符串。

如果我单独运行 babel，它会按预期工作：

browserify ./script1.ts -o ./app.js -p tsify
babel ./app.js --out-file ./app-babel.js

我错过了什么步骤？

Answer 1

问题是默认情况下 babel 只会对 .JS 和 .JSX 文件进行操作。不幸的是，目前无法从 .babelrc 配置文件 (https://github.com/babel/babel/issues/3741).

进行配置

所以这必须从命令行配置：

browserify ./script1.ts -o ./app.js -p tsify -t [ babelify --extensions ".ts",".tsx",".js",".jsx" ]

或来自代码：

browserify({ entries: files })
  .plugin(tsify)
  .transform(babelify, {
    extensions: [
      '.ts', '.tsx', '.js', '.jsx'
    ]
  });

请注意，在指定此扩展列表时，babel 仍会自动加载任何 .babelrc 内容。

babelify 转换不是运行

babelify transform not running

node.js

browserify

babeljs

tsify

babelify 转换不是 运行

babelify transform not running

node.js

browserify

babeljs

tsify

babelify 转换不是运行