Vue中引入react组件
创始人
2024-05-11 04:30:40

1、安装vuera库

命令: yarn add vuera 或者 npm i -S vuera

2、安装React 和 React Dom依赖

命令 :   yarn add react   yarn add react-dom

3、安装其他相关依赖

 命令: yarn add @babel/core -D(建议版本 "^7.12.9")

            yarn add  @babel/plugin-transform-runtime -D (建议版本"^7.17.0")

                yarn add  @babel/preset-env -D (建议版本"^7.13.9")

             yarn add  @babel/preset-react -D (建议版本"^7.16.7")

     yarn add babel-loader -D (建议版本"^8.2.2")

4、main.js 里面相关配置

引入 VuePlugin

import { VuePlugin } from "vuera";Vue.use(VuePlugin);

5、根目录新增vue.config.js文件,配置如下:

	module.exports = {chainWebpack: (config) => {config.module.rule("src").test(/.(js|jsx)$/).use("babel-loader").loader("babel-loader").options({presets: ["@babel/preset-react","@babel/preset-env","@vue/cli-plugin-babel/preset",],plugins: ["@babel/plugin-transform-runtime"],});},};

随笔小结,不喜勿喷,谢谢。

相关内容

热门资讯

日本民众举行“抗议高市”集会,...   10日晚间,约2.7万名日本民众聚集在东京的国会议事堂周边,手持彩色荧光棒举行名为“国会前行动:...
AI眼中的世界杯8强:14个模...   世界杯进入最后冲刺阶段,冠军争夺已经进入白热化。而在球场之外,另一场“比赛”也迎来关键阶段如今,...
中国石化宣布完成对中国航油的重... (来源:长江日报)记者从中国石化新闻办获悉,中国石化宣布完成对中国航油的重组工作,中国航油正式成为中...
史诗级回收!科技股行情是撤退还... 周五的行情体会就三个字——挫败感。见证航天事业重大突破的同时,也承受着账户缩水的现实。这是资金转移到...
4100亿跌到1000亿,Mi... 解禁期将至,MiniMax再迎大考。文|金玙璠编辑|魏佳来源|定焦One(ID:dingjiaoon...