vue cli + vue2 老项目 迁移 vite

最新推荐文章于 2024-09-30 16:53:15 发布
最新推荐文章于 2024-09-30 16:53:15 发布
阅读量3.2k 收藏 3
点赞数 1
分类专栏： 基础 文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u013165804/article/details/127771398
版权 
官方教程
https://vueschool.io/articles/vuejs-tutorials/how-to-migrate-from-vue-cli-to-vite/

报错  The JSX syntax extension is not currently enabled

请这样处理

如果是在js文件中带有jsx语法, 则将改为.jsx扩展名文件

.js(has jsx) => .jsx

如果是在.vue文件中带有jsx语法, 则在script标签下增加该标识

.vue(has jsx) => <script lang="jsx">


其他的看个人项目慢慢调试
vue2中使用jsx基础
CuiCui_web的博客
08-02 1331
总结：如果子组件里传过来的不是个对象，那直接render里{scope} 没问题。如果写个方法，return， 直接回显就是[object,object]。下面一个示例包含一些基础的方法使用、v-if的用法、v-show、v-for的使用， 这里就偷个懒了，不挨个拆分来细讲了。在父组件中直接使用scope， 我们这时候页面上显示的是undefined， 实际上他是一个object。这时候，我们在页面上看到的就是 [object,object]如果子组件里面用的插槽中传参是一个对象，子组件child01中。
【沉淀之华】强烈推荐后端同学使用的新版Vue框架速成之路: Vue + Vite + TypeScript + Antd~ 你没有玩过的全新版本!
浮-沉
12-26 984
这里是牺牲一定未知稳定性，因为后端童鞋写前端肯定不是为了TOC，否则就单独招聘了，所以哪怕技术框架新有些小毛病也没啥，但是带来的好处是，你可以不用那么多考虑版本兼容问题，因为越老或者越成熟的版本，向后兼容是有一定的问题，比如Vue2.x 和Vue3 区别还是很大的，至少Vue3有很多简化写法是非常提升效率，强烈推荐新手直接使用Vue3。拉一个成品项目改改，刚开始肯定能跑起来，但是久而久之，你不断叠加新的内容的时会越来越发现项目的维护变得不可控，这其实非常依赖项目设计之初原创作者的功力。
vue2中使用JSX语法报错，如何解决？
jayccx的专栏
08-24 926
vue2中使用JSX语法报错，如何解决？ 1、安装必要的依赖和插件： 2、在babel配置文件中添加插件： 3、在组件中使用JSX语法：
[pluginviteimport-analysis] vite 提示jsx语法报错
爱学习的大雄的博客
12-15 4801
*注意：**我也找到文章中许多关于这个报错的解决方案是添加一个依赖，具体解决方案我也放在下面。其实是我的代码写错位置了，原本template中的代码写在了外面。在vite.config.ts中配置。安装vite的jsx包。
vite项目如何集成jsx
qq_40681984的博客
01-26 517
vite项目如何集成jsx、vite+vue+ts模板
vue2.0目前项目webpack更换vite
u010026207的博客
03-26 3975
更换原因：目前我使用webpack，使用jekins打包很慢，有时都无法忍受，所以我尝试了一下更换vite后进行打包，发现打包速度上真的会快很多，最主要的原因是因为cesium，vite提供了插件。 更换步骤： 1、添加依赖:package.json yarn addvite yarn adddotenv (因为之前在webpack的时候，直接使用环境变量就好了，但是vite.config.js里面，自己定义的环境变量是获取不到的，所以只能获取文件，然后dotenv帮我转换成可读的环境变量进行...
vite-plugin-vue2:Vite的Vue2插件
03-31
vite-plugin-vue2 用法 运行yarn add vite-plugin-vue2 --dev 将插件添加到vite.config.js // vite.config.js const { createVuePlugin } = require ( 'vite-plugin-vue2' ) module . exports = { plugins : [ createVuePlugin ( /*options*/ ) ] , } vueTemplateOptions 类型： Object 默认值： null @vue/component-compiler-utils 。 jsx 类型： Boolean 默认值： false jsx转换的选项。 jsxOptions 类型： Object @vue/babel-preset-jsx 。 去做 SSR构建 源图
vite2+vue3使用jsx报错React is not defined
SCUhzs
08-24 1176
vite2+vue3使用jsx报错React is not defined
基于vue-cli / vite + vue3.0 + antd2.0 + ts4.0 的后台管理系统模板
10-15
在实际应用中，开发者需要注意Vue 3.0和Vue 2.x之间的迁移策略，以及Vite与Vue CLI之间的配置差异。对于Ant Design Vue 2.0，要熟悉其组件API和样式定制规则。此外，TypeScript的学习和熟练使用也是必不可少的，尤其...
uni-app系列（一）用cli创建支持Vue3Vite的uni-app项目
m0_67394360的博客
03-08 584
更新HBuilderX编译器到3.3.0+，HBuilderX 3.3.0+的编辑器支持基于 Vite 编译到小程序平台。 至此，uni-app在App/H5/小程序全平台支持Vue 3.0开发，且全平台支持Vite编译器。 用cli创建支持Vue3/Vite的uni-app项目 1、命令行创建 Vue3/Vite 工程 # 创建以 javascript 开发的工程 npx degit dcloudio/uni-preset-vue#vite my-vue3-project # 创建以 types
vite+vue3搭建uniapp开发环境
热门推荐
kuizuo12的博客
03-27 1万+
最近想搞个移动端或小程序的 Vue3 项目，所以选择跨端开发平台就显得十分重要。在业内主要有两个跨端开发平台，Taro 与 uniapp，但 uniapp 貌似对 vue3 的支持不是特别友好。所以让我在 Taro 和 uniapp 之间抉择了一段时间，最终还是尝试选择相对熟悉的 uniapp 来进行开发。 :::caution 前排提醒 目前 uniapp 对 Vue3 的支持还处于 alpha 版，即开发阶段，大概率是会遇到很多问题的。 ::: 开发环境搭建 建议安装 HBuilderX，主要是 u.
将 Vue2 项目迁移到 Vue3
Chihirozy的博客
09-30 2504
Vue3 中的示例（使用。
Vue2.0 + JSX
A-Select °
08-07 1158
JSX 简介 JSX是一种Javascript的语法扩展，JSX = Javascript + XML，即在Javascript里面写XML，因为JSX的这个特性，所以他即具备了Javascript的灵活性，同时又兼具html的语义化和直观性。 应用场景 为了让大家更方便的去理解JSX的作用及用法，小编先为大家罗列了几个可能会用到JSX的应用场景。 在消息框内添加html 在开发过程中，经常会用到消息框，使用消息框可能的一种写法是这样的 Message.alert({ messge: '确定要删除?',
Vite 基础之 Vite 的认识、Vite 基础应用的 vite 创建 vue3 项目、vue3 使用 jsx、vite 创建 vue2 项目、vite 创建 react 项目、postcss
浮生离梦的博客
05-21 2066
一、Vite 的认识 Vite 是构建工具，高阶封装，Vite 的特点，如下所示： 开发时效率极高 开箱即用，功能完备 社区丰富，兼容 rollup 超高速热重载 预设应用和类库打包模式 前端类库无关 Vite 的目标是使用简单、快、便于扩展。它的类似产品如 Snowpack、WMR、@web/dev-server 等等。Vite 和传统构建工具的区别，如下所示： High Level API 不包含自己编译能力 完全基于 ESM 加载方式的开发时 Vite 减少了很多配置量，减少的工作，
vue3 vite搭建项目 使用jsx语法报错问题
KKDKK_的博客
02-01 2929
注意 需要根据vite版本进行对应版本安装，否则引入会报错（vite.createFilter is not a function.....）因为vue3中使用了jsx语法，但是并未配置相关的插件。安装 @vitejs/plugin-vue-jsx。安装后需在vite.config.js中引入。我的项目是quasar框架，引入方式略有不同。
安装@vitejs/plugin-vue-jsx并使用
weixin_45932157的博客
11-26 1065
【代码】安装@vitejs/plugin-vue-jsx并使用。
vite5 +vue2 中非js & jsx文件支持 jsx语法插件
weixin_45123004的博客
05-23 899
vite5 vue2 中非 jsx js 文件支持 jsx语法解析
在Vue2和Vue3中JSX的使用集锦
luxigaola的博客
09-16 3704
有时候，我们使用渲染函数（render function）来抽象组件，而渲染函数使用Vue的h函数来编写Dom元素相对template语法差别较大，体验不佳，这个时候就派 JSX 上场了。变量绑定由data中的数据由 **@input="inputChange"或v-on:input=“inputChange”**变为。变量绑定由data中的数据由 **v-model=“value”**变为。变量绑定由data中的数据由 v-for变为插入JSX 语句段。template语法。template语法。
vue cli和vite创建项目
最新发布
03-27
还要注意用户可能关心迁移的问题，比如引用[1]提到从Vue CLI迁移到Vite的方法，但用户的问题主要是创建项目和差异，所以可能不需要深入迁移步骤，但可以稍微提及。 另外，用户引用的内容中有关于版本管理的部分，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值