From 6124e6165f56dffdb441d804d1c812b147fcfc08 Mon Sep 17 00:00:00 2001 From: eclecticcoding Date: Thu, 1 Aug 2019 17:38:23 -0400 Subject: [PATCH 1/2] Added dependencies to bootstrap article when using custom SCSS. --- docusaurus/docs/adding-bootstrap.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/docusaurus/docs/adding-bootstrap.md b/docusaurus/docs/adding-bootstrap.md index 7a8167050aa..83b7a0c93af 100644 --- a/docusaurus/docs/adding-bootstrap.md +++ b/docusaurus/docs/adding-bootstrap.md @@ -32,6 +32,12 @@ import 'bootstrap/dist/css/bootstrap.css'; Sometimes you might need to tweak the visual styles of Bootstrap (or equivalent package).
As of `react-scripts@2.0.0` you can import `.scss` files. This makes it possible to use a package's built-in Sass variables for global style preferences. +To enable `scss` in Create React App you will need to install `node-scss`: + +```sh +yarn add node-scss +``` + To customize Bootstrap, create a file called `src/custom.scss` (or similar) and import the Bootstrap source stylesheet. Add any overrides _before_ the imported file(s). You can reference [Bootstrap's documentation](https://getbootstrap.com/docs/4.1/getting-started/theming/#css-variables) for the names of the available variables. ```scss From 7bb06d9ffbc5c23e7f081954fe9f56e047ad8099 Mon Sep 17 00:00:00 2001 From: eclecticcoding Date: Thu, 1 Aug 2019 19:25:56 -0400 Subject: [PATCH 2/2] Make changes to package designation and added npm install directions. --- docusaurus/docs/adding-bootstrap.md | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/docusaurus/docs/adding-bootstrap.md b/docusaurus/docs/adding-bootstrap.md index 83b7a0c93af..0a06655c76c 100644 --- a/docusaurus/docs/adding-bootstrap.md +++ b/docusaurus/docs/adding-bootstrap.md @@ -32,10 +32,16 @@ import 'bootstrap/dist/css/bootstrap.css'; Sometimes you might need to tweak the visual styles of Bootstrap (or equivalent package).
As of `react-scripts@2.0.0` you can import `.scss` files. This makes it possible to use a package's built-in Sass variables for global style preferences. -To enable `scss` in Create React App you will need to install `node-scss`: +To enable `scss` in Create React App you will need to install `node-sass`. ```sh -yarn add node-scss +npm install --save node-sass +``` + +Alternatively you may use `yarn`:: + +```sh +yarn add node-sass ``` To customize Bootstrap, create a file called `src/custom.scss` (or similar) and import the Bootstrap source stylesheet. Add any overrides _before_ the imported file(s). You can reference [Bootstrap's documentation](https://getbootstrap.com/docs/4.1/getting-started/theming/#css-variables) for the names of the available variables.