【问题标题】:How to get started with NodeJS and Sass project, so I can customize bootstrap 4 theme如何开始使用 NodeJS 和 Sass 项目,这样我就可以自定义 bootstrap 4 主题
【发布时间】:2018-11-18 20:38:52
【问题描述】:

我想自定义 Bootstrap 4 主题,例如颜色、字体等。

我阅读了 Bootstrap 网站的说明,说我需要创建 custom.scss 文件并像这样导入 Bootstrap 的源 Sass 文件

// Custom.scss

// Your variable overrides
$body-bg: #000;
$body-color: #111;

// Bootstrap and its default variables
@import "node_modules/bootstrap/scss/bootstrap";

我是 Sass 和 NodeJS 的新手,我不知道如何开始使用 NodeJS 和 Sass 项目。

我使用 brew 在我的 Mac 上安装了 NodeJS 和 Sass。我还通过键入以下内容安装了 Bootstrap:

npm install bootstrap

这是我取得的最大进步。当我执行命令 npm install bootstrap 时,我不知道引导文件安装在哪个路径中,而且我也不知道如何将引导程序安装到我的项目文件夹中。

任何人都可以提供一些信息或指向有关如何开始使用 NodeJS 和 Sass 项目的资源,以便我可以使用 Sass 自定义 Bootstrap 4 主题。

【问题讨论】:

  • 您好,只是想确认一下,您现在有什么,您想做什么? Node 用于安装 Bootstrap 的 npm,但我想你必须为你的项目编辑一个特定的 Bootstrap 文件。
  • 谢谢。看起来自定义默认的 Bootstrap 4 主题需要 Sass。我只需要有关如何在我的 Mac 中使用 Sass 管理网站的信息。我已经安装了 NodeJS,但我不知道下一步该做什么。
  • 抱歉回复晚了,我想你想要的是你需要一种方法来获取 Bootstrap Sass 文件,使用 Sass 编译器,然后将其编译为 CSS,然后你可以扑通一声到网站上。对吗?

标签: css node.js twitter-bootstrap sass


【解决方案1】:

您必须在项目目录中运行npm install bootstrap 命令。然后,Bootstrap 及其文件将安装到项目目录内的目录node_modules/bootstrap 中。

现在,当您将自定义 scss 文件放入此文件夹时,他们将能够访问引导程序所在的 node_modules 目录。

然后,您可以使用 npm 工具创建自定义构建管道,以将 scss 文件编译为 css。这需要对 node.js 和 NPM 有更深入的了解,但这是通常的推荐方式。

如果你只想编译一次 scss 并从那里使用 css 而不必更深入地使用 node.js,你可以使用像 scss-compile 这样的包,然后使用像 node-sass -rw scssFiles -o cssOutputFiles 这样的控制台命令来编译你的自定义主题一次。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-11-04
    • 2020-11-03
    • 1970-01-01
    • 1970-01-01
    • 2021-03-14
    • 1970-01-01
    相关资源
    最近更新 更多