react中js文件中写html,怎么解决在使用react过程中，大量html写在js文件中？

现在也遇到了这个问题，头大...

解决方案：在FIS中有__inline()这个方法，如果整个方案是用FIS打包，那么问题很好解决

在render的时候这样调用：

render(__inline(xxx.dom))

为什么可以这样呢？FIS对每个文件都有一个process的操作，在对文件进行编译的时候，在babel将其转化之前，__inline已经将dom内置了，后面babel再对文件进行react jsx转化。

问题是！

FIS采用的是component的组件模式，很多组件其实是基于npm包的二次封装，感觉规范还是有点乱，除非在团队中自己封装所需组件，自己定规范。而且components项目已经不维护了，作者提倡使用npm包代替，毕竟现在的趋势是前后端同构，在React中对于后端渲染也相当有用。

FIS可以按需编译，当时感觉在开发基于React和Redux这种需要n个依赖包的项目编译会越来越慢，也有可能是我某些使用方法不对... 总之没有webpack的热替换好用

基于这两点，我暂时投奔了webpack, 那么问题来了

在webpack中，暂时没有找到这个问题的解决方法，参试使用过raw-loader, xxx-template-loader等类似加载器，但感觉方向是错的...

原因是：webpack这种loader的方式是对于特性的文件，比如test:'/.js$/', 只针对js, 然而raw-loader这种可以将独立出来的jsx代码(比如xxx.html)转换为string, 在js文件中render(string)就会报错。

如果用babel-loader来转换dom, require到js文件里，然后render(variable)，这个方案是可行的，我们可以将module.export = function(content){return "module.export=content}"} 封装到一个loader,在babel前加载

但是这种抽象只能满足content中没有自定义组件的情况，一旦content中的jsx包含自定义组件如，Babel编译就会报错，所以显然难以抽象出一个loader

个人觉得解决思路应该是做一个js的loader, 对js中的dom文件引入做替换，然后再进行其他loader，比如：

loader: 'babel!inline-dom'

所以inline-dom这个loader是作用域js，而不是作用域dom文件本身，这涉及到一个编译顺序问题。

总之，webpack怎么解决这个问题呢？求高人指点！