topolr / gulp-vue-parser

Parse .vue file to a single cmd/umd javascript file
MIT License
2 stars 1 forks source link

considering support jsx in Vue2? #1

Open cdll opened 5 years ago

cdll commented 5 years ago

this is such a nice gulp plugin that help me work well with requirejs+vuejs, but now i was trying to use vue2 and with jsx in vue2 component defination, it is all well when i'm using jsx with vue2 with in my data-main script, which was transformed by gulp-babel and babel-plugin-transform-vue-jsx@3.7 plugin, but now i'm trying to make my components into seperated .vue single file component, and trying gulp-vue-parser to help me transform those jsx vue single files into js component files that requirejs could use, just like i made it in working with requirejs+vuejs, but jsx in vue single file component not working well even if i'd tried babel-preset-vue(required babel-helper-vue-jsx-merge-props@2 but working errorly), or babel-preset-jsx(required babel@7 but i was using babel@6) in gulp-vue-parser source code, could u give me a hand with this issue? thanks a lot~

cdll commented 5 years ago

i've also tried this (in node_modules/gulp-vue-parser/parser/codeparser.js):

var babel = require("babel-core");
var _path = require("path").resolve(process.cwd(), "./node_modules/");
module.exports=function (info) {
    if(info) {
        var content = info.content;
        var code = "";
        if (content) {
            code = babel.transform(content, {
                presets: [
                    _path + "/babel-preset-es2015"
                    ,_path + "/babel-preset-stage-2"
                    // ,_path + "/@vue/babel-preset-jsx"
                    // ,_path + "/babel-preset-vue"
                ]
                ,plugins: [
                    'babel-plugin-transform-vue-jsx'
                ]
            }).code;
        }
        return "function(require, exports, module){" + code + "}";
    }else{
        return "function(require, exports, module){}";
    }
};

get the same error in browser just like what gulp-vue-parser and @vue/babel-preset-jsx get:

require.js:1 Uncaught Error: Module name "babel-helper-vue-jsx-merge-props" has not been loaded yet for context: _. Use require([])
http://requirejs.org/docs/errors.html#notloaded

image and here 's what at Line37 in the built js: image

cdll commented 5 years ago

oops! so sorry that i made a mistake that there's something hack in my built code and fortunately that gulp-vue-parser with babel-plugin-transform-vue-jsx is working well! should i create a pr for it or may i wait for you to add it?