微信小程序富文本渲染引擎 wxParser 使用教程

微信小程序富文本渲染引擎 wxParser 使用教程

项目地址:https://gitcode.com/gh_mirrors/wx/wxParser

1. 项目的目录结构及介绍

wxParser 项目的目录结构如下：

wxParser/
├── CHANGELOG.md
├── LICENSE
├── README.md
├── app.js
├── app.json
├── app.wxss
├── pages/
│   └── index/
│       ├── index.js
│       ├── index.json
│       ├── index.wxml
│       └── index.wxss
├── utils/
│   └── wxParser/
│       ├── index.js
│       ├── index.wxml
│       ├── index.wxss
│       └── wxDiscode.js
└── wxParser/
    ├── index.js
    ├── index.wxml
    ├── index.wxss
    └── wxDiscode.js

目录结构介绍

• CHANGELOG.md: 项目更新日志。
• LICENSE: 项目许可证。
• README.md: 项目说明文档。
• app.js: 小程序的入口文件。
• app.json: 小程序的全局配置文件。
• app.wxss: 小程序的全局样式文件。
• pages/: 存放小程序的页面文件。
  • index/: 示例页面目录。
    • index.js: 页面逻辑文件。
    • index.json: 页面配置文件。
    • index.wxml: 页面结构文件。
    • index.wxss: 页面样式文件。
• utils/: 存放工具类文件。
  • wxParser/: wxParser 工具类文件。
    • index.js: wxParser 工具类入口文件。
    • index.wxml: wxParser 工具类模板文件。
    • index.wxss: wxParser 工具类样式文件。
    • wxDiscode.js: wxParser 工具类辅助文件。
• wxParser/: wxParser 核心文件。
  • index.js: wxParser 核心逻辑文件。
  • index.wxml: wxParser 核心模板文件。
  • index.wxss: wxParser 核心样式文件。
  • wxDiscode.js: wxParser 核心辅助文件。

2. 项目的启动文件介绍

app.js

app.js 是小程序的入口文件，负责初始化小程序的全局变量和全局函数。以下是 app.js 的基本结构：

App({
  onLaunch: function () {
    // 小程序启动时的初始化操作
  },
  globalData: {
    // 全局数据
  }
})

app.json

app.json 是小程序的全局配置文件，用于配置小程序的页面路径、窗口表现、网络超时时间等。以下是 app.json 的基本结构：

{
  "pages": [
    "pages/index/index"
  ],
  "window": {
    "navigationBarTitleText": "wxParser示例"
  }
}

app.wxss

app.wxss 是小程序的全局样式文件，定义了小程序的全局样式。以下是 app.wxss 的基本结构：

@import "wxParser/index.wxss";

/* 其他全局样式 */

3. 项目的配置文件介绍

pages/index/index.json

index.json 是小程序页面的配置文件，用于配置页面的窗口表现、使用的组件等。以下是 index.json 的基本结构：

{
  "usingComponents": {
    "wxparser": "/utils/wxParser/index"
  }
}

app.json

app.json 中还可以配置插件的使用，以下是使用 wxParser 插件的配置示例：

{
  "plugins": {
    "wxparserPlugin": {
      "version": "0.1.0",
      "provider": "wx9d4d4ffa781ff3ac"
    }
  }
}

通过以上配置，可以在小程序中使用 wxParser 插件进行富文本内容的渲染。

wxParser 微信小程序富文本渲染引擎 项目地址: https://gitcode.com/gh_mirrors/wx/wxParser