【微信小程序】入门Day1

最新推荐文章于 2024-09-16 15:12:03 发布

MrsBaek

最新推荐文章于 2024-09-16 15:12:03 发布

阅读量104

点赞数

文章标签：微信小程序小程序笔记

本文链接：https://blog.csdn.net/mrsbaek/article/details/131687932

版权

微信小程序入门DAY1

项目的基本组成结构

pages：用来存放所有小程序的页面
utils：用来存放工具性质的模块（如，格式化时间的自定义模块）
app.js：小程序项目的入口文件
app.json：小程序项目的全局配置文件
app.wxss：小程序项目的全局样式文件
project.conifg.json：项目的配置文件
sitemap.json：用来配置小程序及其页面是否允许被微信索引
所有小程序页面都存放在pages目录中，以单独的文件夹存在
每个页面由四个基本文件组成：
.js文件：页面的脚本文件，存放页面数据、事件处理函数等
.json文件：当前页面的配置文件，配置窗口的外观、表现等
.wxml文件：页面的模板结构文件
.wxss文件：当前页面的样式表文件

JSON配置文件

json是一种数据格式，在实际开发中，json总是以配置文件的形式出现。小程序项目中也不例外：通过不同的.json配置文件，可以对小程序项目进行不同级别的配置。

小程序项目中有四种json配置文件

项目根目录中的app.json
项目根目录中的project.config.json
项目根目录中的sitemap.json
每个页面文件夹中的**.json**

app.json文件

app.json

{
  "pages":[ //用来记录当前小程序所有页面的路径
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window":{//全局定义小程序所有页面的背景色、文字颜色等
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "Weixin",
    "navigationBarTextStyle":"black"
  },
  //全局定义样式版本
  "style": "v2",//v2默认使用最新样式
  "sitemapLocation": "sitemap.json"//用来指明sitemap.json的位置
}

project.config.json

{
  "description": "项目配置文件",
  "packOptions": {
    "ignore": [],
    "include": []
  },
  "setting": {//保持了编译相关配置
    "bundle": false,
    "userConfirmedBundleSwitch": false,
    "urlCheck": true,
    "scopeDataCheck": false,
    "coverView": true,
    "es6": true,
    "postcss": true,
    "compileHotReLoad": false,
    "lazyloadPlaceholderEnable": false,
    "preloadBackgroundData": false,
    "minified": true,
    "autoAudits": false,
    "newFeature": false,
    "uglifyFileName": false,
    "uploadWithSourceMap": true,
    "useIsolateContext": true,
    "nodeModules": false,
    "enhance": true,
    "useMultiFrameRuntime": true,
    "useApiHook": true,
    "useApiHostProcess": true,
    "showShadowRootInWxmlPanel": true,
    "packNpmManually": false,
    "enableEngineNative": false,
    "packNpmRelationList": [],
    "minifyWXSS": true,
    "showES6CompileOption": false,
    "minifyWXML": true,
    "babelSetting": {
      "ignore": [],
      "disablePlugins": [],
      "outputPath": ""
    },
    "condition": false
  },
  "compileType": "miniprogram",
  "libVersion": "2.19.4",
  "appid": "wx60b28888**",//改成自己的appid
  "projectname": "miniprogram-92",//项目名称不影响
  "condition": {},
  "editorSetting": {
    "tabIndent": "insertSpaces",
    "tabSize": 2
  }
}

sitemap.json

配置小程序是否允许被微信索引
当开发者允许微信索引时，微信会通过爬虫的形式，为小程序的页面内容建立索引。当用户的搜索关键字和页面的索引匹配成功的时候，小程序的页面将可能展示在结果中

{
  "desc": "关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html",
  "rules": [{
  "action": "allow",//or disallow
  "page": "*"
  }]
}