【微信小程序】导入项目

news/2024/11/13 5:33:10/

1.在微信开发工具中,点击【导入项目】

在这里插入图片描述

2.在打开的界面中执行2个步骤

  • 1.找到要导入项目的路径
  • 2.AppID要改成自己的AppID
    在这里插入图片描述

3.package.json包初始化【装包之前要确保有package.json文件】

  • 1.在【资源管理器】空白处,点击鼠标右键,选择【】,这样就可在项目文件夹下打开cmd
    在这里插入图片描述
  • 执行命令npm init -y,生成package.json文件
    在这里插入图片描述

4.安装指定版本号的Vant Weapp包

# 通过 npm 安装
npm i @vant/weapp -S --production

指定版本号执行下面命令: 在@vant/weapp后面添加 @+版本号 例如:@1.3.3

# 通过 npm 安装
npm i @vant/weapp@1.3.3 -S --production

在这里插入图片描述

5.修改 app.json

在这里插入图片描述
去除,意味着,我们不使用新版的样式,防止样式冲突
在这里插入图片描述

6.构建 npm 包

在这里插入图片描述
在这里插入图片描述

7.使用Vant组件

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
button按钮使用频繁,可以在app.json文件中全局注册,任意页面就可以直接使用

// 通过 npm 安装
// app.json
"usingComponents": {"van-button": "@vant/weapp/button/index"
}

在这里插入图片描述


http://www.ppmy.cn/news/1516636.html

相关文章

aspera上传数据至NCBI

aspera安装与使用(NCBI上传下载工具)-生物信息学工具31 要使用Aspera命令行上传文件并完成提交,您可以按照以下步骤操作: 第一步:准备您的文件 组织文件:确保每个提交的序列文件都在一个目录中&#xff…

高效工作的同时持续推动自我提升的策略

在快速迭代的编程世界中,程序员们不仅需要高效完成日常编码任务,还需不断学习新技术、深化专业知识,以应对日益复杂的项目挑战。然而,如何在繁忙琐碎的编码工作与个人成长之间找到平衡,是不少程序员都面临的一个难题。…

【ORACLE】decode() 函数

在Oracle数据库中,DECODE 函数是一个非常有用的条件表达式,它类似于其他编程语言中的 switch-case 或 if-else 语句。DECODE 函数可以简化查询中的条件逻辑,使得SQL语句更加简洁和易于理解。 基本语法 DECODE 函数的基本语法如下&#xff1…

EmguCV学习笔记 VB.Net 6.6 图像的矩

版权声明:本文为博主原创文章,转载请在显著位置标明本文出处以及作者网名,未经作者允许不得用于商业目的。 EmguCV是一个基于OpenCV的开源免费的跨平台计算机视觉库,它向C#和VB.NET开发者提供了OpenCV库的大部分功能。 教程VB.net版本请访问…

智能码二维码zhinengma.cn相比传统二维码有哪些优势?

智能码二维码相比传统二维码具有显著的优势,主要体现在更高的信息存储容量、更强的纠错能力、更高的安全性,以及更广泛的应用场景。以下是智能码二维码的优势介绍: 更高的信息存储容量:智能码二维码可以存储更多的数据信息&#…

打卡53天------图论(应用题)

一、字符串接龙 经过上面的练习,大家可能会感觉 广搜不过如此,都刷出自信了,本题让大家初步感受一下,广搜难不在广搜本身,而是如何应用广搜。 代码随想录 无JS官方题解代码。 二、有向图的完全可达性 深搜有细节&…

CSS 实现 两栏布局、三栏布局,以及常见的水平居中的方法

CSS 常见的页面布局 两栏布局方式一:浮动方式二:浮动方式三:flex 布局方式四:利用定位方式五;利用定位 三栏布局方式一:flex 布局方式二:定位方式三:浮动圣杯布局双飞翼布局 常见的水…

eclipse汉化教程

1:选择HELP->install New software 2:点击Add 3:name随便填写,location:https://download.eclipse.org/technology/babel/update-site/latest/ 4:等待下载完成后点next 5:选择中文,再点击next 6. 等待…