vue和react組件是否可能互相編譯？

01-11

vue、react、angular2三個框架中，目前react的生態和社區是最火的，但是vue也有其特色。同時vue和react在很多地方都很相似，那麼是否可能通過互相編譯，將兩個生態中的組件互相打通，形成一個更大的生態呢？
vue、react和angular 2.x誰是2016年的主流？ - 尤雨溪的回答

有兩種做法，一是用 A 的組件裡面套一個 B 的組件。這個其實挺簡單，因為 Vue 和 React 的頂層 API 都侵入性不強。優點是實現簡單，缺點是得同時用兩邊的 runtime。

如果是純粹的互編譯，理論上也是可行的，但是 Vue 編譯到 React 更簡單一點。本質上就是把 Vue 組件的模板 parse 一下，然後生成一個 React 的 render 函數。其實我有一個 branch 就是把 Vue 組件編譯到了 virtual-dom，能跑，但是要把所有細節做對要花些時間。React 編譯到 Vue 更複雜一些，雖然可以用 Babel 獲得 JSX 的語法樹，但因為 render 函數中可以出現任意 JS 邏輯，可能出現的 edge case 要多得多。純編譯的做法，好處是只需要目標的 runtime，缺點就是要把所有細節都做好比較費力。

如果不考慮題主的『互相編譯』這個要求，@戴嘉華提到的將兩邊都編譯到一個第三方的 virtual-dom 實現也是一個很不錯的思路，不過這裡面要處理的細節就更多了，主要的精力都會花在保證兩個 runtime 各自的特有 API 都能正確工作... 就像『something that works』和『something that is spec-compliant』之間的區別。

可以。

但是你要做的不是把Vue編譯成React，或者React編譯成Vue。而是把它們兩個都編譯成Virtual-DOM的Render函數，這個函數接收狀態，吐出Virtual-DOM。就相當於構建了一個Virtual-DOM的VM，而這兩者的編譯結果都運行在這個VM之上。它們在這個VM上可以互相diff、patch，達到了生命的大和諧。

Vue編譯成Virtual-DOM你只需要用一個現成的HTML parser把它parse成Virtual-DOM Render函數；而React本來就採用Virtual-DOM可能會方便一點。

最後的結果就是你兩者的Runtime都不需要，只一個需要能夠解析和運行Virtual-DOM演算法的lib。甚至你可以自己寫一個文法，編譯成VD，交給這個lib去跑就行了。是不是有點像編譯器中的llvm？