Question

我正在使用jQuery Noty插件在GUI中生成通知，我想使用mo动画。甚至还有一个示例动画，我想在他们的website上使用。

在uglifying我的代码库后，这是返回的错误：

SyntaxError：意外的令牌：name（x150）消息：SyntaxError：意外的令牌：名称（x150）＆＃39;，fileName：... \ notifications.js＆＃39;， lineNumber：118，stack：＆＃39; 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('.'));
});

更新

我试过了一个不同的minifier（带有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形状

更新

1 个答案: