主要參考官方文檔：https://uniapp.dcloud.io/nvue-outline，但是一些常見的問題，自己遇到了，記錄下先。
一、nvue是什么？
uni-app App端內置了一個基於 weex 改進的原生渲染引擎，提供了原生渲染能力。
在App端，如果使用vue頁面，則使用webview渲染；如果使用nvue頁面(native vue的縮寫)，則使用原生渲染。一個App中可以同時使用兩種頁面，比如首頁使用nvue，二級頁使用vue頁面，hello uni-app示例就是如此。
雖然nvue也可以多端編譯，輸出H5和小程序，但nvue的css寫法受限，所以如果你不開發App，那么不需要使用nvue。
以往的 weex ，有個很大的問題是它只是一個高性能的渲染器，沒有足夠的API能力（比如各種push sdk集成、藍牙等能力調用），使得開發時非常依賴原生工程師協作，開發者本來想節約成本，結果需要前端、iOS、Android 3撥人開發，適得其反。 nvue 解決了這個問題，讓前端工程師可以直接開發完整 App，並提供豐富的插件生態和雲打包。這些組合方案，幫助開發者切實的提高效率、降低成本。
同時uni-app擴展了weex原生渲染引擎的很多排版能力，修復了很多bug。
二、NVUE的一些常見問題
1、字體設置不生效
發現字體怎么設置都不生效，后來在文檔里這樣一句話：
只有
text標簽可以設置字體大小，字體顏色
所以只能改為這樣即可：
<view class="mb12">
<text class="font14 bold">第{{cp.catalogNo}}章 {{cp.title}}</text>
</view>
將view里的文字用text包一層即可。突然想起來之前看weex的時候，好像就說了，文字只能寫在text標簽里
2、背景顏色設置不生效
設置 background: #f2f6fc; 但是發現怎么都不生效；其實在編譯階段就會有提示 background 不支持之類的
不支持復合樣式，不支持簡寫
所以改為這樣即可：border等之類的樣式也是一樣的問題
.desc{ background-color: #f2f6fc; border-radius: 8rpx; padding: 16rpx 20rpx; }
3、默認flex布局，並且默認flex-direction:cloumn;
所以如果你想要 row 形式，則需要寫明：flex-direction: row;
4、選擇器支持少，只支持class選擇器。
放一張官網注意事項吧：
5、文本溢出及多行溢出的問題
nvue不支持white-space，所以H5端的文本溢出不好使。nvue提供了自己的寫法
text-overflow
text-overflow {string}：設置內容超長時的省略樣式。
| 可選值 | 描述 |
|---|---|
| clip | 修剪文本 |
| ellipsis | 顯示省略符號來代表被修剪的文本 |
只支持
text和ricthext
lines
lines {number}: 正整數，指定最大文本行數，默認lines值為0，表示不限制最大行數lines。如果文本不夠長，實際展示行數會小於指定行數。
所以這樣寫即可：
/* #ifdef APP-PLUS-NVUE */ .n-nowrap{ text-overflow: ellipsis; lines: 1; width: 280px; } /* #endif */
6、nvue不支持css的border屬性嗎
支持，寫法要求嚴格點。按照weex的這個文檔寫：https://weex.apache.org/zh/docs/styles/common-styles.html#border-style
不用改weex模式，css是一樣的。uni-app模式和weex模式的區別主要是組件寫法不一樣。