辛米尔标准界面组件·LED灯集

npm 包

npm 包之名称

@xinmier/ui--led-lights 。

npm 包之主页

https://www.npmjs.com/package/@xinmier/ui--led-lights。

概述

@xinmier/ui--led-lights 是一个 npm 包，下称【本软件】。

本软件拟包含一系列界面编程组件，面向网页开发人员，而非最终用户。

本软件拟包含的一系列界面组件，应全都是 LED 灯及其配套功能。但实际上目前仅包含一款 LED 灯，及其配套的所谓“灯箱”。

本软件中的所有组件均采用 Vuejs 3 框架编写。仅适用于 Vuejs 3 。

用法（面向网页开发人员）

安装

本软件服务于采用 Vuejs 3 框架的网页开发项目。故而，欲采用本软件，须先自行架设一个 Vuejs 3 项目。

在命令行环境中，cd 进入你的网页开发项目的文件夹，并执行以下命令：

npm  i  @xinmier/ui--led-lights

在代码中使用本软件包内诸组件

本工具包含若干组件，每个组件各自有专门的说明书。

又，本工具集之 Git 仓库暂未公开，除非团队内部人员，一般无法访问 Git 仓库。故而，一般人在 npmjs.com （或其镜像网站）无法直接查阅本品中诸组件之说明书。于是， 本品自 v1.1.1 版始，在 npm 发布内容集中，故意包含了各组件之说明书。在安装好本品之后，这些说明书均存放在宿主项目的 ./node_modules/@xinmier/ui--led-lights/文档集/ 这一文件夹内。

各组件之说明书如下。

• 《LED 灯款式 01 的说明书》。

  • 在代码库中的相对路径。
  • 在《码云》上的绝对路径。

• 《LED 灯款式 01 · 带文字标签的灯箱的说明书》。

  • 在代码库中的相对路径。
  • 在《码云》上的绝对路径。

重要变更

• 自 v2.0.0 版始，一切【样式类名】中：

  1. 凡【实体身份标识】类的【样式类名】，凡根级，一律以 xme-- 开头。例 .xme--led-light--style-1 。
  2. 凡【实体身份标识】类的【样式类名】，凡内层，一律以 st-- 开头。例 .st--led-light--bulb 。
  3. 凡表征【状态】的【样式类名】，一律以 zt-- 开头。例 .zt--led-light--is-on 。

  小结：本组件库共有三种【样式类名】前缀： xme-- 、 st-- 和 zt-- 。

• 自 v3.0.0 版始，一切【样式类名】中：

  1. 凡【实体身份标识】类的【样式类名】，凡根级，一律以 xme-- 开头。例 .xme--led-light--style-1 。
  2. 凡【实体身份标识】类的【样式类名】，凡内层，一律以 shi-ti-- 开头。例 .shi-ti--led-light-bulb 。
  3. 凡表征【状态】的【样式类名】，一律以 zhuang-tai-- 开头。例 .zhuang-tai--light-is-on 。

  小结：本组件库共有三种【样式类名】前缀： xme-- 、 shi-ti-- 和 zhuang-tai-- 。

用法（面向网页开发人员）

见本项目源代码库随附示例集：

1. 《示例01》。

   须知，为避免《示例01》中采用的 Vue 与【本软件】采用的 Vue 不是同一个【内存实例】，《示例01》在其 package.json 文件中，指明其采用的 vue 来自 file:../../node_modules/vue 。