0

我正在寻找一个新的反应项目,我对使用bootstrap-material-design充满希望,但我不确定如何设置项目来覆盖主题。文档讨论了添加自定义 sass,但我不熟悉 sass。我希望有人知道你需要什么步骤才能完成这项工作。我已经使用 npx create-react-app 创建了一个全新的 react 应用程序,并使用 npm 通过npm install bootstrap-material-design@4.1.1. 我还在scss项目的根级别添加了一个文件夹,该文件custom.scss夹中有一个文件。目前添加到该文件的唯一代码是导入他们的 sass 文件,@import "node_modules/bootstrap/scss/bootstrap";但是当我添加诸如导航栏之类的材料设计组件时似乎没有任何反应。我还导入了文件中的 custom.scssindex.js文件import './scss/custom.scss';但我仍然收到以下错误:File to import not found or unreadable: ../../node_modules/bootstrap/scss/bootstrap.

我想我的问题是,有没有人通过使用 npm 安装而不是使用 cdn 在 react 项目中成功使用了这个包,如果是的话,他们能告诉我启动和运行它所需的步骤,以便我可以重新主题 bootstrap-material - 用我自己的品牌设计。

谢谢!

4

1 回答 1

0
  1. 安装所需的包
    npm install bootstrap-material-design node-sass
  2. 添加 SASS 路径
    打开.env,添加以下魔法
    SASS_PATH=node_modules:srcSASS_PATH=./node_modules;./src用于 windows
  3. 将 App.css 重命名为 App.scss
  4. 打开 App.scss
    添加以下代码:@import 'bootstrap-material-design/scss/bootstrap-material-design.scss';

到目前为止为我工作。

于 2020-09-24T01:32:26.537 回答