fex-team/fis-parser-babel-6.x

a babel 6.x parser for fis

fis-parser-babel-6.x

插件默认开启了 preset-2015 preset-stage-3 preset-react，如果希望使用更多的babel插件，可以使用插件配置自行添加

插件配置文档可以参考 https://babeljs.io/docs/usage/api/#options

FIS2用法

fis.config.set('project.fileType.text', 'es');
fis.config.set('modules.parser.es', 'babel-6.x');
fis.config.set('roadmap.ext.es', 'js');

FIS3用法

fis.set('project.fileType.text', 'es');
fis.match('server/**.es', {
    parser: fis.plugin('babel-6.x', {
        // presets: [
        // 注意一旦这里在这里添加了 presets 配置，则会覆盖默认加载的 preset-2015 等插件，因此需要自行添加所有需要使用的 presets
        // ]
    }),
    rExt: 'js'
});

如何开启resourcemap

以下例子以 FIS3 为示例，FIS2可参考调整

fis.match('server/**.es', {
    parser: fis.plugin('babel-6.x', {
        sourceMaps: true
    }),
    rExt: 'js'
});

如果使用的是 FIS2 ，为了保证 sourcemap 的功能正常，请确认 FIS2 版本 > 1.9.3

FIS2 下如何只为 *.es.js 开启Babel编译

fis.config.set('modules.parser.js', 'babel-6.x');
fis.config.set('settings.parser.babel-6.x');

fis.config.get('roadmap.path').unshift({
    reg: '**.es.js',
    useBabel: true  // 开启 Babel 编译，可以忽略
}, {
    reg: '**.js',
    useBabel: false // 关闭 Babel 编译
});

DEMO

https://github.com/fex-team/fis3-demo/tree/master/use-react

fis-parser-babel-6.x's Issues

解析 class 内部私有属性 或者 内部方法互相调用失败

例如：
export class Util {
doc = window.document;
constructor() {}
/**
* 序列化
*
* @param {any} value
* @static
* @memberof Util
*/
static serialize(value) {
if (typeof value === 'string') {
return value;
}
return JSON.stringify(value);
}

/**
 * 反序列化
 * 
 * @param {any} value 
 * @static 
 * @memberof Util
 */
static deserialize(value) {
    if (typeof value !== 'string') {
        return undefined;
    }
    try {
        return JSON.parse(value);
    } catch (e) {
        return value || undefined;
    }
}

/**
* HTML5存储 [本地存储 localStorage 和 Session存储 sessionStorage]
*
* @static
* @memberof Util
*/
static storage() {
let ls = window.sessionStorage || window.localStorage;
if (!ls) {
return null
};
return {
set: function (key, value) {
ls.setItem(key, Util.serialize(value));
},
get: function (key) {
return Util.deserialize(ls.getItem(key));
},
remove: function (key) {
ls.removeItem(key);
},
clear: function () {
ls.clear();
}
}
}
}
报错：util.js:178 Uncaught ReferenceError: doc is not defined

babel 官网 试了下 需要 babel-preset-stage-2 支持。

修改fis-conf.js

    postprocessor: function (content, file, settings) {
        let babel = require('babel-core');
        let preset2015 = require('babel-preset-es2015');
        let presetstage2 = require('babel-preset-stage-2');
        let react = require('babel-preset-react');
        settings = fis.util.extend({
            presets: [
                preset2015,
                presetstage2,
                react
            ]
        }, settings);

        // 添加 jsx 的 html 语言能力处理
        if (fis.compile.partial && file.ext === '.jsx') {
            content = fis.compile.partial(content, file, {
                ext: '.html',
                isHtmlLike: true
            });
        }

        let result = babel.transform(content, settings);
        return result.code;
    },

修改 node_module 下的插件文件
var babel = require('babel-core');
var preset2015 = require('babel-preset-es2015');
// var presetstage3 = require('babel-preset-stage-3');
var presetstage2 = require('babel-preset-stage-2');
var react = require('babel-preset-react');

module.exports = function (content, file, conf) {
// 添加 useBabel 配置项，如果 useBabel 为 false 则不进行编译
if (file.useBabel === false) {
return content;
}

conf = fis.util.extend({
    presets: [
        preset2015,
        presetstage2,
      //  presetstage3,
        react
    ]
}, conf);

// 添加 jsx 的 html 语言能力处理
if (fis.compile.partial && file.ext === '.jsx') {
    content = fis.compile.partial(content, file, {
        ext: '.html',
        isHtmlLike: true
    });
}

// 出于安全考虑，不使用原始路径
// conf.filename = file.subpath;

var result = babel.transform(content, conf);
return result.code;

};

都无法编译。

建议例子中的后缀名将.es6修改为.es

为什么我要这么建议呢，因为你是官方例子，请不要误导大家，es6这个名字不好的，为什么呐，babel是准备支持es6 7 8 9 。。。的，而你只写es6，那我的代码里能不能系es7的代码呢，写了es7的代码然后呢，就有歧义了，所以建议修改为es

情况怎样了？

这里的 babel6 怎样了啊？半年都没动静！

[ERROR] parser.babel-6.x: Couldn't find preset "es2015" relative to directory "/page/demo"

配置presets或者plugins都会报错
去掉下面这句不会报错

conf.filename = file.subpath;

这个插件现在可以用于生产环境了吗？

我想用，但是有点方。。想知道你们自己�已经�把这个插件用在生产环境了吗？

不支持async函数

使用async后报regeneratorRuntime is not defined，请问要如何使用polyfill？

缺少fis2使用例子

sourceMaps: true 配置没有产生 .map 文件

sourceMaps: true 配置没有产生 .map 文件
fis.match('{*.jsx,*:jsx}', { parser: fis.plugin('babel-6.x', { sourceMaps: true }), rExt: '.js' });

https://github.com/fex-team/fis3-demo/tree/master/use-react
换成 babel-6.x .map 文件产生

fis.util.extend is not a function

这是什么原因？
我的fis版本是1.10.5

parse.babel-6.x: Unkonown plugin "transform-decorators-legacy"

fis3的配置如下:
parser: fis.plugin('babel-6.x', { presets: ['es2015', 'react', 'stage-0'], plugins: ["transform-decorators-legacy"], sourceMaps: true, }), rExt: '.js'
fis3 release报错:
parse.babel-6.x: Unkonown plugin "transform-decorators-legacy"
求问原因和解决办法~