以下问题全部发生在windows上,Mac上未知
1. 安装
按照官网文档执行了yarn global add @tarojs/cli
中途没有报错,一切正常,然后执行
taro init myApp
,报错,重启shell也不行这是因为yarn没有加到环境变量里,shell中输入yarn global bin
,会得到一个yarn的安装目录,复制这个路径,到电脑的环境变量中,选path,添加上去
确定之后,必须要将shell重启,然后才能执行taro init myApp
还有个办法可以避免以上问题,直接用npm代替yarn,npm install -g @tarojs/cli
,npm安装的taro-cli不用再手动加入环境变量
2. taro-ui安装
按照taro-ui官方的demo,安装后,在app.scss中加入@import "~taro-ui/dist/style/index.scss";
,然后在页面组件上引入import { AtButton } from 'taro-ui'
,报错
并且在不断地闪屏,无法停下来
这是因为项目里的taro版本是3.x,所以taro-ui也必须是3.x,目前taro-ui的正式版本只有2.x,只有beta版才是3.x。输入npm show taro-ui versions
后可以看到
所以用yarn add taro-ui@3.1.0-beta.6
即可
3. 找不到模块“react/jsx-runtime”或其相应的类型声明
ts的报错,会让标签下面跟着一堆红波浪线
还有些报错则是 xxx不能用作JSX组件,其元素类型不是有效的JSX组件,诸如此类
原因:
未知,应该是types有冲突
https://github.com/NervJS/taro/issues/11097
解决:
在types文件夹里添加jsx-runtime.d.ts
,内容为
declare global {
namespace JSX {
// @ts-ignore
type Element = any;
}
}
export {};
然后在tsconfig.json中增加以下即可
"compilerOptions": {
"jsx": "react-jsx",
"baseUrl": ".",
"paths": {
"react/jsx-runtime": ["./types/jsx-runtime.d.ts"]
}
},
这样能解决View,Text组件的声明文件问题,但是无法解决AtButton这种Taro-ui的声明文件报错
3. TaroUI声明文件无法找到
点这个jsx.d.ts进去后发现,怎么会跳到vue的文件目录下,好恶心啊
直接删掉这个node_modules里的vue目录可以解决,但是总不能每次都手动删吧
发现这个vue包是被 taro-hooks包引入的依赖,那么不用taro-hooks这个包即可