【问题标题】:Using es6 transpiled classes in Nodejs在 Nodejs 中使用 es6 转译的类
【发布时间】:2016-03-25 05:42:59
【问题描述】:

所以我的文件ContrivedExampleA.es6中有我的示例类

export class Person {
    constructor(name, age) {
        this._name = name;
        this._age = age;
    }

    get name() {
        return this._name;
    }

    get age() {
        return this._age;
    }
}

export class Greeter {
    constructor(person) {
        this._person = person;
    }

    greet() {
        return `Hello ${this._person.name}, I believe you are ${this._person.age} years old!`;
    }
}

我使用以下 Gulp 任务编译(成功):

var gulp = require('gulp');
var browserify = require('browserify');
var babelify = require('babelify');
var source = require('vinyl-source-stream');

gulp.task('build', function () {
    return browserify({entries: './src/ContrivedExampleA.es6', extensions: ['.es6'], debug: true})
        .transform(babelify)
        .bundle()
        .pipe(source('example.js'))
        .pipe(gulp.dest('build'));
});

所以我想在常规的 Nodejs 领域使用此代码,所以我执行以下操作:

"use strict";

var Person = require('./example').Person;
var Greeter = require('./example').Greeter;

var person = new Person("Test Person", 25);
var greeter = new Greeter(person);
console.log(greeter.greet());

但是,PersonGreeter 均未定义。我什至尝试在我的.babelrc 文件中包含transform-es2015-modules-commonjs,但没有任何帮助。

我做错了什么?以及如何将这些转译的 ES6 类导入常规 Nodejs 文件?

编辑

我还有一个.babelrc 文件,看起来像:

{
  "presets": ["es2015"],
  "plugins": ["transform-es2015-modules-commonjs"]
}

【问题讨论】:

    标签: node.js gulp browserify babeljs


    【解决方案1】:

    忽略我之前的回答,我专注于错误的事情。

    如果你想将常规的 ES6 类导入到 Nodejs 文件中,你可以一起跳过 browserify 和 babelify 步骤,直接使用 gulp-babel 插件。我也建议使用gulp-rename

    您的ContrivedExampleA.es6 文件将保持不变,但您的gulpfile.js 将变为:

    var gulp = require('gulp');
    var babel = require('gulp-babel');
    var rename = require('gulp-rename');
    
    gulp.task('build', function () {
        return gulp.src('./src/ContrivedExampleA.es6')
            .pipe(babel({presets: ["es2015"], plugins: ["transform-es2015-modules-commonjs"]}))
            .pipe(rename('example.js'))
            .pipe(gulp.dest('build'));
    });
    

    注意:既然你有一个.babelrc,你可能会跳过将选项传递给 babel。

    然后在你的节点文件中,你可以简单地做

    "use strict";
    
    var Person = require('./example').Person;
    var Greeter = require('./example').Greeter;
    
    var person = new Person("Test Person", 25);
    var greeter = new Greeter(person);
    console.log(greeter.greet());
    

    【讨论】:

    • 我的 .babelrc 文件中已经有了它,但我会试试看!
    • @DamonSwayn 我还有一些时间,请参阅上面的固定答案。
    猜你喜欢
    • 2019-01-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-01-03
    • 2019-10-20
    • 2018-11-08
    • 2017-03-31
    • 2020-12-18
    相关资源
    最近更新 更多