# @salla\.sa/twilight-tailwind-theme 中文文档

规范地址：https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/

版本：3\.0\.21
npm 元数据更新时间：2026-11-02T09:07:06.520Z
中文译文更新时间：2026-11-02T09:55:03.593Z
软件包许可：GPL-3\.0

本文由上游 README 机器翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40salla.sa/twilight-tailwind-theme
原文对照：https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/?lang=original
项目主页：https://salla.dev/

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：706 kB，11 个文件
- TypeScript 类型：未声明
- 运行依赖：0 个
- 首次发布：2021-11-17T16:03:59.898Z
- 最新版本发布：2026-11-02T09:07:06.262Z
- 已发布版本数：990（近 12 个月 326 个）

## 中文简介

暮光顺风主题（Salla Themes）

## 安装

```sh
npm install @salla.sa/twilight-tailwind-theme
```

也可以使用：`pnpm add @salla.sa/twilight-tailwind-theme`、`yarn add @salla.sa/twilight-tailwind-theme`、`bun add @salla.sa/twilight-tailwind-theme`

## README

  

[![Logo](https://salla.dev/wp-content/uploads/2023/03/1-Light.png)](https://salla.dev/)

# 《暮光之城》Tailwind-Theme

Tailwind-Theme Plugin注册 暮光Web组件 样式并使用JavaScript而不是CSS注入它们。对于基于顺风的主题来说，这是一个很好的起点。  
[**浏览我们的博客»**](https://salla.dev/)  
[报告错误](https://github.com/SallaApp/twilight-components/edit/master/packages/tailwind-theme/issues/new) · [请求功能](https://github.com/SallaApp/twilight-components/edit/master/packages/tailwind-theme/discussions/new) . [< /萨拉开发者>](https://t.me/salladev) . [官方文档](https://docs.salla.dev/docs/twilight-themes-documentation)

目录表

1.  [概述](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-overview)
2.  [使用](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-usage)
    -   [启用了JIT的](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-jit-enabled)
3.  [添加新组件](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-add-a-new-component)
4.  [发布](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-publish)
5.  [支持](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-support)
6.  [贡献](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-contributing)
7.  [学分](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-credits)
8.  [许可证](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-license)

  

## 概述

的样式 [暮光Web组件](https://github.com/SallaApp/twilight-components) 然后使用JavaScript而不是CSS将它们注入主题样式表。它也可以作为一个启动主题的任何主题为基础 [顺风](https://tailwindcss.com/).

## 使用

默认情况下，任何 [Tailwind-based](https://tailwindcss.com/) 主题将查找 `tailwind.config.d.ts` 文件，以检索任何预设置和自定义。因此，插件Tailwind-Theme应该添加到 `tailwind.config.d.ts` 文件如下：

```js
plugins: [
  ...
  require('@salla.sa/twilight-tailwind-theme'),
  ....
]
```

### 启用了JIT的

**顺风** 增加了一个 [即时编译器](https://v2.tailwindcss.com/docs/just-in-time-mode)，它在开发人员编写主题时生成样式，而不是在初始构建时提前生成所有内容。由于JIT模式通过扫描模板文件按需生成CSS，因此开发人员必须配置 `content` 选项中的 `tailwind.config.d.ts` 文件中包含所有主题路径，否则CSS类将为空。

```js
...
content: [
  // theme views
  "views/**/*.twig",
  // list of classes which required by twilight web components
  "node_modules/@salla.sa/twilight-tailwind-theme/safe-list-css.txt"
],
...
```

## 添加新组件

使用Tailwind，开发人员可以通过将预先存在的类直接应用到HTML中来样式化元素。这是使用实用程序类来构建自定义设计，而无需编写CSS。在此基础上，开发人员只需执行以下步骤即可开发新组件：

1.  用新组件的名称创建一个新文件夹。
2.  创建一个 `utilities.json` 包含新组件类列表的文件，格式为json。

## 发布

最后，开发人员可以使用以下命令发布项目：

```
npm run publish
```

（[回到顶部](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-top)）

## 支持

团队总是在这里帮助你。碰巧遇到了问题？想要报告bug？你可以在Github上提交一个 [问题跟踪器](https://github.com/SallaApp/theme-raed/issues/new)。如果您还有任何问题，请通过电子邮件与我们联系 [电报机器人](https://t.me/SallaSupportBot) 或加入全球开发者社区 [电报](https://t.me/salladev).

（[回到顶部](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-top)）

## 贡献

贡献使开源社区成为一个学习、启发和创造的神奇场所。 你做的任何贡献都是 **极大的赞赏**.

如果你有一个更好的建议，请fork repo并创建一个pull request。 你也可以简单地打开一个带有“增强”标签的问题。别忘了给这个项目打个星！再次感谢!

1.  分岔项目
2.  创建特性分支(`git checkout -b feature/AmazingFeature`）
3.  提交更改(`git commit -m 'Add some AmazingFeature'`）
4.  推至分行(`git push origin feature/AmazingFeature`）
5.  打开拉取请求

（[回到顶部](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-top)）

## 学分

-   [萨拉](https://github.com/sallaApp)
-   [所有贡献者](https://npmcn.com/package/contributors)

（[回到顶部](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-top)）

## 许可证

麻省理工学院许可证（MIT）。请参阅 [许可文件](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/LICENSE.md) 了解更多信息。

（[回到顶部](https://npmcn.com/package/%40salla.sa/twilight-tailwind-theme/#readme-top)）

## 常见问题

### @salla\.sa/twilight-tailwind-theme 是什么？

暮光顺风主题（Salla Themes）

### 如何安装 @salla\.sa/twilight-tailwind-theme？

在项目目录运行 npm install @salla\.sa/twilight-tailwind-theme，或使用 pnpm add / yarn add / bun add。

### @salla\.sa/twilight-tailwind-theme 支持 TypeScript 吗？

该包的 package\.json 没有声明类型入口。需要类型提示时，可以在 npm 上查找社区维护的 @types/salla\.sa\_\_twilight-tailwind-theme 是否存在。

### @salla\.sa/twilight-tailwind-theme 可以商用吗？

@salla\.sa/twilight-tailwind-theme 使用 GPL-3\.0 许可。强 Copyleft：分发包含该代码的软件时，整个作品需以 GPL-3\.0 兼容许可开源，并附带专利与反锁定条款。仅内部使用不触发此义务。以上为概括，不构成法律意见，请以许可原文为准。

### @salla\.sa/twilight-tailwind-theme 还在维护吗？

最新版本 3\.0\.21 发布于 2026/11/02（1 天前）；至今共发布 990 个版本，其中过去 12 个月发布了 326 个；首次发布于 2021/11/18。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。