微信小程序 npm构建+vant-weaap安装

微信小程序:工具-npm构建

报错

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

解决

1、新建miniprogram文件后,直接进入到miniprogram目录,再次执行下面两个命令,然后再构建npm成功

npm init -y
npm install express(Node js后端Express开发,不使用可以不安装)
npm install

Express框架是Node.js基金会的一个项目,官方网址为http://expressjs.com。(中文网站为
http://expressjs.com/zh-cn)。它提供了对Node.js原生API比较好的封装,从而使开发者更容易的使用Node.js,并用来开发强壮的Web、移动应用,以及API的一些其他功能。开发人员还能够方便的为它开发插件和扩展,从而增加Express的能力。
(Node js后端Express开发,不使用可以不安装)

2、在project.config.json文件找到‘setting’并添加如下配置
在根目录创建一个miniprogram文件夹
将pages、utils、app、sitemap.json等和源代码相关的文件移到miniprogram文件夹下。
在这里插入图片描述

 "packNpmManually": true,//默认是false,要改成true"packNpmRelationList": [{"packageJsonPath": "./package.json", //不一定这个位置,看package.json对应位置//例如    "packageJsonPath": "./miniprogram/package.json","miniprogramNpmDistDir": "./miniprogram/"}],

在这里插入图片描述
再安装:

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

进行工具–npm 构建
构建成功,给页面引入组件就可以使用
微信小程序官网-自定义组件
index.josn

{"usingComponents": {"van-button": "@vant/weapp/button/index"}
}

每个人状况不一样:如下

如果报错:构建失败
vant-weapp官网
新版本没有
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
3、配置完先不要急于去点【构建npm】,而是先点击【重新打开此项目】(防止出现一些奇怪的问题)
在这里插入图片描述
4、等待项目重新打开加载完成后,再点击【构建npm】
在这里插入图片描述
微信开发工具构建

安装vant-weaap

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

注意:

配置好项目的路径之后记得重新打开项目再构建,

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

智慧校园的机遇与挑战

随着5G、物联网、大数据等技能的日渐老练,数字化正在渗透到各行各业中,为事务立异和价值增加供给支撑。在教育职业,运用智能化体系赋能教育办理越来越受欢迎,教育信息化方针一再出台,进一步加快了智慧校园落地的脚步。…

Linux - 文件管理高级 sed

3.处理字符 sed ① sed 默认情况下不会修改原文件内容 ② sed 是一种非交互式的编辑器 3.1 工作原理 将原文件一行一行的进行处理,取出一行,放入“模式空间进行处理”,处理完成之后将结果输出到屏幕上,然后读取下一行&#xf…

彭涛 | 2024年5月小结

5月份还是蛮有刺激的,做了蛮多的事情,但是没赚到钱,真是一屯操作猛如虎,一看账户0.5。 就喜欢创业这种一天天累死累活还不赚钱的感觉,哈哈哈哈 老规矩简单说下这个月的情况,如果对你有收获就最好了。 游学丹…

【Tlias智能学习辅助系统】04 部门管理 删除 和 新增

Tlias智能学习辅助系统 04 部门管理 删除 和 新增 删除部门APIDeptController.javaDeptService.javaDeptServiceImpl.javaDeptMapper.java前端联调 新增部门API有一步简化DeptController.javaDeptService.javaDeptServiceImpl.javaDeptMapper.java前端联调 删除部门API 请求路径…

Selenium+Java 环境搭建

selenium 介绍 Selenium 是 web 应用中基于 UI 的自动化测试框架,支持多平台、多浏览器、多语言。 早期的 selenium RC 已经被现在的 webDriver 所替代,可以简单的理解为selenium1.0webdriver 构成 现在的 Selenium2.0 。现在我们说起 selenium &#xf…

适合学生写作业的台灯有哪些?台灯怎么选详细攻略!

在数字化飞速发展的今天,孩子们的学习和生活越来越离不开电子屏幕。然而,长时间盯着屏幕,不仅容易让眼睛感到疲劳,更是近视问题日益严重的元凶之一。每一位家长都希望孩子能拥有健康的视力,因此会为孩子挑选一台护眼灯…

MySQL十部曲之九:MySQL优化理论

文章目录 前言概述查询优化查询执行计划EXPLAIN获取表结构信息获取执行计划信息 EXPLAIN 输出格式如何使用EXPLAIN进行优化 范围访问优化单列索引的范围访问多列索引的范围访问 索引合并优化索引合并交叉访问算法索引合并联合访问算法索引合并排序联合访问算法 索引下推优化连接…

豆包浏览器插件会造成code标签内容无法正常显示

启用状态:页面的代码会显示不正常 禁用后,正常显示 害得我重置浏览器设置,一个个测试

spring mvc 中怎样定位到请求调用的controller

前言 在java web开发过程中,正常情况下controller都是我们自己写的,我们可以很方便的定位到controller的位置。但是有些时候我们引入的其他依赖中可能也有controller,为了找到并方便的调试jar包中的controller,我们一般会进行全局…

【CPP】双端队列简介(deque)

简介:双端队列(deque) 目录 1.概述2.特点3.底层原理 1.概述 双端队列:是一种顺序表和顺序表的结合数据结构,不是队列。 它提供顺序表的[]下标访问和链表的中间头部的较高效率插入删除操作。 2.特点 顺序表的优缺点: 优点&…

linux之docker- image.tar 的导出和导入

一、情况 docker 镜像有时无法从外网访问,需要把docker 打包导出到本地,然后以文件的形式,发送给其他人,再然后其他人把docker 镜像文件导入到自己的服务器本地镜像仓库,方可使用。也可把镜像上传到公司内网。下面就开…

Verilog HDL基础知识(二)

引言:本文继续介绍Verilog HDL基础知识,重点介绍赋值语句、阻塞与非阻塞、循环语句、同步与异步、函数与任务语法知识。 1. 赋值语句 在Verilog中,有两种进行赋值的方法,即连续赋值语句和过程赋值语句(块&#xff09…

Java数据结构-二叉搜索树

目录 1. 概念2. 二叉搜索树的操作2.1 查找2.2 插入2.3 删除 3. 全部代码 1. 概念 二叉搜索树是特殊的二叉树,也叫二叉排序树,它的特点是:每个结点的左子树上的所有结点的值都小于这个结点的值,右子树上的所有结点的值都大于这个结点的值,另外所有的左子树和右子树也分别为二叉…

详解 Spark 编程之 RDD 依赖关系

一、依赖与血缘关系 依赖:两个相邻 RDD 之间的关系血缘关系:多个连续的 RDD 的依赖由于 RDD 不会保存数据,为了提高容错性,每个 RDD 都会保存自己的血缘关系,一旦某个转换过程出现错误,可以根据血缘关系重新…

随身wifi网络卡顿怎么解决?随身WiFi哪个牌子的最好用?排名第一名的随身WiFi!

对于随身wifi靠不靠谱这个问题,网上一直存在争议。很多人的随身wifi网速不稳定,信号看着满格就是上不了网。关于随身wifi卡顿到底该怎么解决呢? 1.如果是设备网络在一个地方上网速度很快,换一个地方网络就不行了,很可能…

Linux学习笔记(清晰且清爽)

本文首次发布于个人博客 想要获得最佳的阅读体验(无广告且清爽),请访问本篇笔记 Linux安装 关于安装这里就不过多介绍了,安装版本是CentOS 7,详情安装步骤见下述博客在VMware中安装CentOS7(超详细的图文教…

ios v品会 api-sign算法

vip品会 api-sign算法还原 ios入门案例 视频系列 IOS逆向合集-前言哔哩哔哩bilibili 一、ios难度与安卓对比 这里直接复制 杨如画大佬的文章的内容: ios难度与安卓对比 很多人说ios逆向比安卓简单,有以下几个原因 1 首先就是闭源,安卓开源…

vscode过滤器@modified(查看配置了哪些设置)

文档 visualstudio•docs•getstarted•settingshttps://code.visualstudio.com/docs/getstarted/settings 说明 使用modified可以过滤出: 配置过的设置(和默认值不同); 在 settings.json 文件中配置了值的设置 步骤 1.打开…

Vue3实战笔记(53)—奇怪+1,VUE3实战模拟股票大盘工作台

文章目录 前言一、实战模拟股票大盘工作台二、使用步骤总结 前言 实战模拟股票大盘工作台 一、实战模拟股票大盘工作台 接上文&#xff0c;这两天封装好的组件直接应用,上源码&#xff1a; <template><div class"smart_house pb-5"><v-row ><…

JS对象由浅入深

对象 对象&#xff08;Object&#xff09;&#xff1a;JavaScript里的一种数据类型&#xff08;引用类型&#xff09;&#xff0c;也是用于存储数据的 好处&#xff1a;可以用来详细的描述某个事物&#xff0c;是用键值对形式存储语义更明了 特点&#xff1a;对象数据是无序的&…