vue3+taro+Nutui 开发小程序(一)

前言:最近在调研开发小程序,发现现在taro框架逐渐成熟,能完美地使用vue3来进行开发,调研中发现京东的Nutui也不错所以准备写一个由0到1的vue3+taro+Nutui的小程序。

这篇我们首先搭建一个框架:

vscode插件准备环节:

目前我用到的插件如下:

  • Eslint   用来vue格式化代码的
  • Prettier 用来格式化js代码
  • Volar   作为vue的二代插件,集成了vetur的相关功能
  • Unocss 用来原子化快速生成css

初始化项目

初始化项目之前,需安装 taro,请参考 Taro 文档,完成 taro 安装

使用命令创建模板项目:

taro init myApp

 安装 cli 用来执行构建等操作,之后启动项目,会生成一个 dist 目录

npm install @tarojs/cli

npm dev:weapp

打开微信开发工具 工程目录需要指向构建出来的 dist 文件

这样我们就可以看到初始化的小程序了

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/43116.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Sublime Text 4 激活教程(Windows+Mac)

下载安装 官网 https://www.sublimetext.com 点击跳转 2023.7.21 版本为4143 Windows激活方式 一、激活License方式 入口在菜单栏中"Help” -> “Enter License” 注意格式,可能会过期失效,失效就用方式二 Mifeng User Single User License E…

F.interpolate 数组采样操作

功能:利用插值方法,对输入的张量数组进行上\下采样操作,换句话说就是科学合理地改变数组的尺寸大小,尽量保持数据完整。 在计算机视觉中,interpolate函数常用于图像的放大(即上采样操作)。比如在细粒度识别领域中&…

《Unix环境高级编程》第三版源代码编译

CentOS 7.6 进行编译 使用cat /etc/redhat-release看到操作系统是CentOS Linux release 7.6.1810 (Core),使用uname -r看到内核是3.10.0-957.el7.x86_64,gcc --version可以看到gcc版本是4.8.5。 wget http://www.apuebook.com/src.3e.tar.gz下载《Uni…

java学习路程之篇一、进阶知识、面向对象高级、static关键字、继承、final关键字、this、super

文章目录 1、面向对象高级2、static关键字3、继承4、final关键字 1、面向对象高级 2、static关键字 3、继承 4、final关键字

MyBatis学习笔记——4

MyBatis学习笔记——4 一、MyBatis的高级映射及延迟加载1.1、多对一1.1.1、第一种方式:级联属性映射1.1.2、第二种方式:association1.1.3、第三种方式:分步查询 1.2、一对多1.2.1、第一种方式:collection1.2.1、第二种方式&#x…

【OAuth2】OAuth2概述及使用GitHub登录第三方网站

【OAuth2】OAuth2概述及使用GitHub登录第三方网站 文章目录 【OAuth2】OAuth2概述及使用GitHub登录第三方网站0. 导言1. OAuth2 简介2. OAuth2 认证授权总体流程3. OAuth2 标准接口4. OAuth2 四种授权模式4.1 授权码模式4.2 简化模式4.3 密码模式4.4 客户端模式 5. GitHub授权登…

Docker 的数据管理、容器互联、镜像创建

目录 一、数据管理 1.数据卷 2. 数据卷容器 二、容器互联(使用centos镜像) 三、Docker 镜像的创建 1.基于现有镜像创建 1.1首先启动一个镜像,在容器里修改 1.2将修改后的容器提交为新的镜像,需使用该容器的id号创建新镜像 …

电脑显示连接上WiFi,但没办法上网

问题: 电脑显示已经连接上WiFi。但是百度不出来东西,也没办法打开任何网页。 解决方法: win10系统 在左下角搜索栏,搜索“代理服务器设置”。 找到手动设置代理 —》关闭“使用代理服务” 【默认是打开的】 关闭之后即可上网~~

【Git】分支合并冲突产生与解决

文章学习自:麦兜搞IT,如有侵权,告知删除 文章目录 前言1 Fast Forword 合并1.1 核心原理1.2 举个栗子1.3 经验之谈 2 three way merge2.1 核心原理2.2 举个栗子(不带冲突)2.3 带冲突的three way merge 3 变基rebase3.…

Android WiFi框架概览

概览 Android 提供默认 Android 框架实现,其中包括对各种 WLAN 协议和模式的支持,这些协议和模式包括: WLAN 基础架构 (STA)网络共享模式或仅限本地模式下的 WLAN 热点 (Soft AP)WLAN 直连(点对点)WLAN 感知 (NAN)WL…

【简单认识MySQL主从复制与读写分离】

文章目录 一、MySQL主从复制1、配置主从复制的原因:2、主从复制原理1、 MySQL的复制类型2、 MySQL主从复制的工作过程;1、 MySQL主从复制延迟2、优化方案:3、 MySQL 有几种同步方式: 三种4、异步复制(Async Replication&#xff0…

Stream流List转Map报错Duplicate key StreamMap

项目场景: JDK8引入了Stream流,让程序员在开发中更方便进行集合之间的转换,在使用Stream流将List转为Map时,如果Map的key有重复的情况下,就会抛出java.lang.IllegalStateException: Duplicate key StreamMap这个异常。…

算法竞赛备赛之经典数据结构训练提升,暑期集训营培训

1.链表与邻接表:树与图的存储 我们将结构体和指针结合来实现链表 struct Node {int val;Node * next; }; ​ new Node;//这样创建结点是相当慢的 我们算法主要是用数组来模拟链表,这样效率会高一些。 数组模拟单链表 邻接表:存储图和树 实…

KubeVela篇06:Kubevela Addon插件安装原理

addon支持从本地、git仓库、helm chart仓库安装,最终原理都相同,因此我们以本地安装为例。 完整流程如下: 从指定目录读取一个完整的addon安装包。 根据metadata.yaml配置文件,校验插件要求的kubevela、k8s的版本,不满足版本要求则终止安装。 根据metadata.yaml配置文件…

深入理解 PostgreSQL 的架构和内部工作原理

🌷🍁 博主 libin9iOak带您 Go to New World.✨🍁 🦄 个人主页——libin9iOak的博客🎐 🐳 《面试题大全》 文章图文并茂🦕生动形象🦖简单易学!欢迎大家来踩踩~&#x1f33…

FPGA配置文件从串并模式下载

FPGA配置文件的下载模式有5种: 主串模式(master serial)从串模式(slave serial)主并模式(master selectMAP)从并模式(slave selectMAP)JTAG模式 其中,JTAG模…

信捷PLC RC低通滤波器(C语言实现)

PLC信号处理系列之RC低通滤波器算法详细介绍请参考下面文章: PLC信号处理系列之一阶低通(RC)滤波器算法_plc滤波算法程序_RXXW_Dor的博客-CSDN博客1、先看看RC滤波的优缺点 优点:采用数字滤波算法来实现动态的RC滤波,则能很好的克服模拟滤波器的缺点; 1、在模拟常数要求较…

什么小程序需要商家自营相关类目?

1、百货:小程序主体公司综合零售商,在线售卖多种日用品,需补充商家自营-百货类目。预包装食品定义: 预包装食品,指预先定量包装或者制作在包装材料和容器中的食品;包括预先定量包装以及预先定量制作在包装…

配置右键点击文件夹通过IDEA打开项目

0、 前言 你是不是每次打开idea项目时,都需要走一遍这样的流程: 1、先启动idea 2、然后手动选择项目路径 3、打开项目 于是在打开项目的路上就耗费了大量的时间。 这篇文章会教你通过配置,让项目可以直接通过右键打开,大大提升项…

【JAVA】云HIS系统功能菜单知识(二)

随着医疗信息化和互联网技术的不断发展,云HIS在大数据管理和应用的优势日益凸显。对于医疗机构而言,云HIS平台可以帮助其实现更高效的医疗服务管理,并提高医疗服务的整体水平和效率。 一、系统管理 1.医院信息 基本信息、法人代表、主要负责…