小程序创建与项目初始化(构建 npm + 集成 Sass)

news/2024/12/23 7:42:17/

一、打开微信开发者工具

  1. 确认 左侧导航栏是否选中的 小程序
  2. 点击 【+】创建小程序
    在这里插入图片描述

二、创建小程序
在这里插入图片描述
在这里插入图片描述

三、初始化

  1. 清空 app.wxss、app.js

  2. 去掉 rendererOptions 和 componentFramework 不需要最新的搜索引擎

  3. 留下以下文件
    在这里插入图片描述
    四、自定义构建 npm + 集成 Sass

  4. 首先 先把小程序源码文件 放到 新建的 miniprogram 文件夹下
    在这里插入图片描述

  5. 在 project.config.json 配置 miniprogramRoot 选项,指定小程序源码的目录

  6. 然后配置 project.config.json 的 setting.packNpmManually 为 true,开启自定义 node_modules 和 miniprogram_npm 位置的构建 npm 方式

  7. 在项目右键 点击 【在内建终端中打开】在终端中 输入 【npm init -y】生成package.json 文件
    在这里插入图片描述

  8. 最后配置project.config.json 的 setting.packNpmRelationList 项,指定 packageJsonPath 和 miniprogramNpmDistDir 的位置

  9. 修改后的 project.config.json 文件

{"compileType": "miniprogram","libVersion": "trial","packOptions": {"ignore": [],"include": []},"miniprogramRoot": "miniprogram/","setting": {"packNpmManually": true,"packNpmRelationList": [{"packageJsonPath": "/package.json","miniprogramNpmDistDir": "./miniprogram"}],"useCompilerPlugins": ["sass"],"coverView": true,"es6": true,"postcss": true,"minified": true,"enhance": true,"showShadowRootInWxmlPanel": true,"babelSetting": {"ignore": [],"disablePlugins": [],"outputPath": ""}},"condition": {},"editorSetting": {"tabIndent": "auto","tabSize": 2},"appid": "wx34f339ffd16a69e5","srcMiniprogramRoot": "miniprogram/"
}

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

相关文章

JMeter进行HTTP接口测试的技术要点

参数化 用户定义的变量 用的时候 ${名字} 用户参数 在参数列表中传递 并且也是${} csv数据文件设置 false 不忽略首行 要首行 从第一行读取 true 忽略首行 从第二行开始 请求时的参数设置: 这里的名称是看其接口需要的请求参数的名称 这里的变量名称就是为csv里面…

QLoRa使用教程

一、定义 定义案例1 二、实现 定义 QLoRa: 量化LoRa. 网址:https://huggingface.co/docs/peft/main/en/developer_guides/quantization案例1 1. 4bit 量化LoRa import torch from transformers import BitsAndBytesConfigconfig BitsAndBytesConfig(load_in_4b…

各地户外分散视频监控点位,如何实现远程集中实时监看?

公司业务涉及视频监控项目承包搭建,此前某个项目需求是为某林业公司提供视频监控解决方案,需要实现各地视频摄像头的集中实时监看,以防止国家储备林的盗砍、盗伐行为。 公司原计划采用运营商专线连接各个视频监控点位,实现远程视…

计算机图形学入门28:相机、透镜和光场

1.前言 相机(Cameras)、透镜(Lenses)和光场(Light Fields)都是图形学中重要的组成部分。在之前的学习中,都是默认它们的存在,所以现在也需要单独拿出来学习下。 2.成像方法 计算机图形学有两种成像方法,即合成(Synthesis)和捕捉(Capture)。前…

HBase 在统一内容平台业务的优化实践

作者:来自 vivo 互联网服务器团队-Leng Jianyu、Huang Haitao HBase是一款开源高可靠性、扩展性、高性能和灵活性的分布式非关系型数据库,本文围绕数据库选型以及使用HBase的痛点展开,从四个方面对HBase的使用进行优化,取得了一些…

使用Redis实现签到功能:Java示例解析

使用Redis实现签到功能:Java示例解析 在本博客中,我们将讨论一个使用Redis实现的签到功能的Java示例。该示例包括两个主要方法:sign()和signCount(),分别用于用户签到和计算用户当月的签到次数。 1. 签到方法:sign()…

3d为什么删掉模型不能返回?---模大狮模型网

在展览3D模型设计行业中,设计师们经常面临一个关键问题:一旦删除了模型的某些部分,为什么很难或者无法恢复原始状态?这不仅是技术上的挑战,更是设计过程中需要深思熟虑的重要考量。本文将探讨这一问题的原因及其在实际工作中的影…

【图解大数据技术】Spark

【图解大数据技术】Spark Spark简介RDDSpark示例Spark运行原理整体流程DAG 与 stage 为什么Spark比MapReduce快? Spark简介 Spark与MapReduce一样,也是大数据计算框架。Spark相比MapReduce拥有更快的执行速度和更低的编程复杂度。 Spark包括以下几个模…