vue中使用react組件

  1. 安裝vuera庫
    vuera庫地址:https://www.npmjs.com/package/vuera
    首先需要在Vue項(xiàng)目中安裝vuera庫,安裝指令如下:
// 使用yarn安裝插件
yarn add vuera

// 使用npm安裝插件
npm i -S vuera
  1. 安裝依賴
    由于我們需要在Vue中使用React組件,所以首先需要在項(xiàng)目中安裝React,安裝指令如下:
npm install --save react react-dom

在Vue中,是無法識別jsx語法的,所以需要安裝依賴來識別react-jsx語法,安裝指令如下:

npm install @babel/plugin-transform-react-jsx

安裝完成之后,在babel.config.js文件中添加這個插件即可:

module.exports = {
  plugins: ["@babel/plugin-transform-react-jsx"]
};
  1. 項(xiàng)目配置
    接下來在項(xiàng)目中以插件的形式來引入并使用vuera庫,我們需要在main.js中加入如下代碼:
import { VuePlugin } from 'vuera'
Vue.use(VuePlugin)

(4.小優(yōu)在線業(yè)務(wù) 安裝的依賴)

npm install --save react react-lottie
npm install --save prop-types

5.使用組件
-----end-----

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容