使用 noty 插件丑化 mojs 形状

Question

我正在使用 jQuery Noty 插件在 GUI 中生成通知，我想使用 mo 动画。我什至想在他们的 website.

上使用示例动画

丑化我的代码库后，这是返回的错误：

SyntaxError: Unexpected token: name (x150) message: SyntaxError: Unexpected token: name (x150)', fileName: ...\notifications.js', lineNumber: 118, stack: 'Error\n at new JS_Parse_Error

有问题的行号如下：

var parent = new mojs.Shape({
        parent: n.barDom,
        width: 200,
        height: n.barDom.getBoundingClientRect().height,
        radius: 0,
        x: { [150]: -150 },
        duration: 1.2 * 500,
        isShowStart: true
});

更具体地说，这是导致错误的原因：

{ [150]: -150 }

显然这是无效的，所以我正在寻找这种表示法的替代方法。这可以通过某种方式实现吗？

仅供参考，这是我执行的 gulp 任务：

gulp.task('min:jsscripts', function () {
 return gulp.src(
    [
    'Scripts/**/*.js',
    '!Scripts/**/*.min.js',
    '!Scripts/**/*-debug.js',
    '!Scripts/**/*.map'
    ], { base: "./" })
    .pipe(tfs({ command: 'edit', params: { lock: 'none' } }))
    .pipe(uglify().on('error', function (e) {
        console.log(e);
    }))
    .pipe(rename({ suffix: '.min' }))
    .pipe(diff())
    .pipe(diff.reporter({ fail: false }))
    .pipe(gulp.dest('.'));
});

更新：

我尝试使用不同的缩小器（带有 babili 预设的 babel），这似乎有效。我读到 uglify 不支持 ECMAScript 6，所以这个语法可能是 ECMAScript 6？如果是这样，替代语法是什么？

这是更新后的 gulp 任务：

gulp.task('min:jsscripts', function () {
 return gulp.src(
    [
    'Scripts/**/*.js',
    '!Scripts/**/*.min.js',
    '!Scripts/**/*-debug.js',
    '!Scripts/**/*.map'
    ], { base: "./" })
    .pipe(tfs({ command: 'edit', params: { lock: 'none' } }))
    .pipe(babel({ presets: ['babili'] }).on('error', function (e) {
        console.log(e);
    }))
    .pipe(rename({ suffix: '.min' }))
    .pipe(diff())
    .pipe(diff.reporter({ fail: false }))
    .pipe(gulp.dest('.'));
});

如果我对 ECMASCript 6 语法的假设是正确的（您会注意到我在这方面相当缺乏经验），我需要做什么才能将其转换为 ECMASCript5？我的 gulp 任务已经这样做了吗？

Answer 1

我的怀疑是正确的...我必须转换上面的代码以使其符合 ES5。这是结果：

var parent = new mojs.Shape({
                    parent: n.barDom,
                    width: 200,
                    height: n.barDom.getBoundingClientRect().height,
                    radius: 0,
                    x: _defineProperty({}, 150, -150),
                    duration: 1.2 * 500,
                    isShowStart: true
                });

function _defineProperty(obj, key, value) {
        if (key in obj) {
            Object.defineProperty(obj, key, {
                value: value, enumerable: true, configurable: true, writable: true
            });
        } else { obj[key] = value; } return obj;
}

使用 noty 插件丑化 mojs 形状

Uglify mojs shape with noty plugin

javascript

jquery

jquery-plugins

noty

babeljs

更新：