Vue3 使用 Vite配置JSX/TSX支持

这篇博客介绍了如何在Vue3项目中利用Vite搭建并配置JSX/TSX支持。首先,按照Vite官方文档创建项目,然后安装@vitejs/plugin-vue-jsx插件,并在vite.config.js中进行配置。接着,展示了JSX的正确和错误写法,并提供了一个测试示例来确保配置成功。
摘要由CSDN通过智能技术生成

Vue3 使用 Vite配置JSX/TSX支持

开始搭建项目

详情请按Vite官方文档
各位客官们,注意一下搭建项目之前,请使用npm --version检查一下自己的npm版本,按照文档的不同npm版本对应的不同命令行,对号入座~
如果有使用MacOS的同学,可能会遇到一下子问题:

throw new Error(`esbuild: Failed to install correctly
^

Error: esbuild: Failed to install correctly

Make sure you don't have "ignore-scripts" set to true. You can check this with
"npm config get ignore-scripts". If that returns true you can reset it back to
false using "npm config set ignore-scripts false" and then reinstall esbuild.

If you're using npm v7, make sure your package-lock.json file contains either
"lockfileVersion": 1 or the code "hasInstallScript": true. If it doesn't have
either of those, then it is likely the case that a known bug in npm v7 has
corrupted your package-lock.json file. Regenerating your package-lock.json file
should fix this issue.

    at Object.<anonymous> (/Users/chenwenbin/Nutstore Files/TempWorkSpace/first-vue3/node_modules/esbuild/bin/esbuild:2:7)
    at Module
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值