vue文件转换

[gaorubin1990]

What happens?

如何对vue文件进行转换额。如何设置vue-loader

Mini Showcase Repository(REQUIRED)

Provide a mini GitHub repository which can reproduce the issue.

How To Reproduce

Steps to reproduce the behavior: 1. 2.

Expected behavior 1. 2.

Context

• Father Version:
• Node Version:
• Platform:

[PeachScript]

father 目前不基于 webpack，所以不能用 vue-loader，可以试下：https://github.com/vuejs/rollup-plugin-vue 走 rollup 看看能不能做到，这个方法没有测试过

[gaorubin1990]

father 目前不基于 webpack，所以不能用 vue-loader，可以试下：https://github.com/vuejs/rollup-plugin-vue 走 rollup 看看能不能做到，这个方法没有测试过

是用的babel模式，做vue插件用。这个可以吗

[PeachScript]

这个只能用于 rollup 模式，babel 没找到靠谱的 plugin。你的插件如果不需要引入 .vue 文件，可以直接走 babel，如果需要引入 .vue，得切换成 rollup + 上面这个插件才行

[gaorubin1990]

这个只能用于 rollup 模式，babel 没找到靠谱的 plugin。你的插件如果不需要引入 .vue 文件，可以直接走 babel，如果需要引入 .vue，得切换成 rollup + 上面这个插件才行

试过了，可以转换，但是rollup打包成一个文件

[PeachScript]

打成 1 个 umd 不符合预期？

[gaorubin1990]

打成 1 个 umd 不符合预期？

想要做ui库的插件，想像babel那样分文件的，否则太大

[big-camel]

https://github.com/umijs/father/pull/279

打包vue的时候，babel-plugin-react-require 这类插件会将vue的模版语法 <template><div></div></template> 这种标签识别为jsx，就转换成 React 了。

如果把 https://github.com/vuejs/rollup-plugin-vue 这个插件放在babel插件前面，先把模版语法转换掉就正常了。

要不在extraRollupPlugins 这里定义一个方法，将插件集合传过去，这样就能想放哪儿就放哪儿了～

@PeachScript

试了一下，json规则不允许方法。改成了这样：

extraRollupPlugins: [{before:"babel",plugins:[vue()]},commonjs()]

getRollupConfig.js > getPlugins

extraRollupPlugins.forEach(plugin => {
  if(plugin.after || plugin.before){
      let index = plugins.findIndex(p => p.name === (plugin.after || plugin.before))
      if(index > -1) index += plugin.after ? 1 : 0
      if(index < plugins.length) plugins.splice(index,plugin.replace ? 1 : 0,...plugin.plugins)
      else plugins.push(...plugin.plugins)
    }else{
      plugins.push(plugin)
    }
})
return plugins;