Uni-app踩坑记录

想要在uni-app原来的js项目中直接通过<script lang="ts">中使用ts,安装好了插件以后无法运行,报错了:

查了一圈无果,采用vue-cli直接创建ts项目,首先全局安装vue-cli:win+R输入cmd打开控制台,输入如下代码

npm install -g @vue/cli

接着创建vue+ts项目,之后选择Y,然后选择模板

vue create -p dcloudio/uni-preset-vue my-project

选择ts模板:

即在当前目录下创建了一个名为“my-project”的vue+ts项目。

用HBuilder(https://www.dcloud.io/hbuilderx.html)打开。

运行以后:



自带模板中使用的是默认的vue.extend({}),这里改成我们习惯的class模式:



从工具->插件安装中安装如下插件,尤其是这个内置浏览器。

内置浏览器,方便调试:



在uniapp中设置大小一般可以用rpx,rpx 即响应式px,一种根据屏幕宽度自适应的动态单位。以750宽的屏幕为基准,750rpx恰好为屏幕宽度。屏幕变宽,rpx 实际显示效果会等比放大。

  • 注意 rpx 是和宽度相关的单位,屏幕越宽,该值实际像素越大。如不想根据屏幕宽度缩放,则应该使用 px 单位。

  • 如果开发者在字体或高度中也使用了 rpx ,那么需注意这样的写法意味着随着屏幕变宽,字体会变大、高度会变大。如果你需要固定高度,则应该使用 px 。

  • rpx不支持动态横竖屏切换计算,使用rpx建议锁定屏幕方向



后续持续更新。。。。