前言
NodeBB 是一个现代化的 Node.js 论坛软件，它基于 Web 技术栈，具有扩展性和性能优势。nodebb-theme-vanilla 是 NodeBB 的一个默认主题，它提供了默认的视觉效果和样式。
本文将介绍如何使用 nodebb-theme-vanilla 正确地创建和开发 NodeBB 主题。
安装和配置 NodeBB
首先需要安装 NodeBB，可以通过以下命令来安装：
npm install nodebb -g
安装完成后，你需要设置 NodeBB，根据提示完成安装过程。安装完成后，可以通过以下命令启动 NodeBB：
nodebb start
创建主题
为了使用 nodebb-theme-vanilla，我们需要创建自己的 NodeBB 主题。在 NodeBB 安装目录下，使用以下命令创建主题：
nodebb new-theme mytheme
注意，mytheme 是你的主题名称，可以根据自己的需求任意命名。
安装 nodebb-theme-vanilla 和其依赖项
在主题目录下，使用以下命令安装 nodebb-theme-vanilla 和其依赖项：
npm install nodebb-theme-vanilla --save
此外，还需要安装以下依赖：
npm install async npm install sanitize-html npm install lodash npm install nodebb-widget-essentials
配置主题
在你的主题目录下，创建一个文件夹 templates。在 templates 目录下，创建一个文件夹 partials。
在 partials 目录下，创建一个文件名为 header.tpl 的文件。打开此文件，加入以下内容：
<header>
<h1>MyNodeBB</h1>
</header>在 templates 目录下，创建一个文件名为 home.tpl 的文件。打开此文件，加入以下内容：
-- -------------------- ---- -------
--------- -----
------
------
-----------------------
----- ----------------
----- ---------------- ----------------------------------------------
------- ---------------------------------------------------
------- -------------------------------------
-------
------
---- ------ ---
----- ------- -------- ---
---- ------- ---
---- -------------
-------- -------------------
-------------------
----
---------------
-----
----------
------
---- ------ ---
--------
---------- -- ----------
---------
-------
-------在你的主题目录下，创建一个名为 plugin.json 的文件。打开此文件，加入以下内容：
-- -------------------- ---- -------
-
----- ----------
------- --- -------
-------------- -- ------ ----- --- --------
------ -----------------------------
----------------------- ---------
------------ -
-
------- -----------
----------- ----------
-
--
------------- -
-
------- --------
----------- -------
--
-
------- ---------
----------- --------
-
-
-在你的主题目录下，创建一个名为 library.js 的文件。打开此文件，加入以下内容：
-- -------------------- ---- -------
---- --------
----- ----- - ---------------
----------------------- - ----- -------- --------- -
------- - ----------------
-
----- --------- ---------
--------- -----------
--------- ---------
-
---
------ --------
--
--------------- - ----- -------- -------- --------- -
------ -------------- -
----- ---------
---
--
------------------------ - ----- -------- -------- -
---------------------
------ -------------------
----- -----------------
----- --- ------
---
------ -------
--启用主题
在 NodeBB 安装目录下，打开 config.json 文件，修改 activeTheme 项，设置为你的主题名称，这里是 mytheme。
"activeTheme": "mytheme"
重启 NodeBB，即可启用主题。
结语
本文介绍了如何使用 nodebb-theme-vanilla 和 NodeBB 创建自定义主题。通过本文的指导，可以更好地定制自己的 NodeBB 主题，并提高用户体验。如果你对 NodeBB 此类话题感兴趣，可以深入学习和研究，为此领域的开发和维护做出更多的贡献。
示例代码：https://github.com/qianjiahao/tech-articles/blob/main/npm_package_nodebb_theme_vanilla.md
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/74784