如何对vue sfc进行增删改

Question

项目中想在编译过程中替换掉vue单文件template中的某些语法，这里vue-loader通过vue-template-complier把模板语法编译成vue sfc，但是没有说怎么操作sfc，就像写babel插件一样，难不成要自己遍历？

网上有种思路是通过babel/parser 把 vue sfc 转换成 babel支持的ast，然后通过babel的api进行增删改，那这样又有一个问题，改完后怎么把babel ast 转换成 vue sfc？

Answer 1

vue-loader把.vue文件按template，script和style拆成三个临时文件再交给其他的loader去处理。那你可以尝试一下覆盖loader链，插一个自己的loader进去。找一个vuecli的项目，把webpack配置eject出来调试一下看看。