Question

这是我发表的另一篇文章的延续：click here

我已经下载了INSPINIA管理主题，该主题基于twitter引导程序。它包含针对大多数Web-ui框架（Ember除外）的预先创建的项目。到目前为止已采取的步骤：

已安装ember-boostrap
已安装SASS预处理器
将* .scss文件复制到app \ styles文件夹中
app.scss文件如下所示：

app \ styles \ app.scss

@import "ember-bootstrap/bootstrap";

@import "style";

Ember-Cli-Build.js文件如下：

Ember-Cli-Build.js

'use strict';

const EmberApp = require('ember-cli/lib/broccoli/ember-app');

module.exports = function(defaults) {
  let app = new EmberApp(defaults, {
    'ember-bootstrap': {
      'bootstrapVersion': 4,
      'importBootstrapFont': false,
      'importBootstrapCSS': false
    }
  });
  return app.toTree();
};

Answer 1

工作流程顺序很重要。来自ember-boostrap's "Using CSS preprocessors" section

重要说明：仅当您具有CSS预处理器时，此选项才有效在安装ember-bootstrap本身之前先安装插件。如果那是并非如此，请确保在之后运行默认的安装蓝图安装预处理器插件：ember生成ember-bootstrap！这将执行上述必要的设置步骤。

根据您在此处发布的内容，您随后安装了sass预处理程序。您可以查看inside the addon's blueprint来了解它是如何确定要使用的依赖项的。基本上，这里的代码是在运行ember install <some-addon>之后调用的。如果您查看代码，则将根据您是否已安装某些软件包以及是否具有预处理器来查看条件代码。

对于您而言，您在bootstrap依赖项中应该以{{1}}结尾。检查您的npm和package.json，看看是否已安装。

但是为了进一步帮助您，这正是我刚刚使用startbootstrap.com中的随机主题node_modules创建新项目的工作

sb-admin-2
ember new bootstrap-example --yarn（然后我删除了ember install ember-cli-sass）
app.css
- 值得注意的是，此步骤自动将ember install ember-bootstrap添加到了我的@import "ember-bootstrap/bootstrap";文件中。
将包含该项目的所有scss文件的整个app.scss目录复制到scss
清理了主要vendor/sb-admin-2/scss内部的导入内容，因为其中包含对自己的sb-admin-2.scss路径的引用
将此bootstrap.scss目录添加到我的scss ember-cli-build.js sassOptions数组中：
```
includePaths
```
将sb-admin-2模板的参考添加到 /app/styles/app.scss 中，用于：sassOptions: { includePaths: [ 'vendor/sb-admin-2/scss', ] }
将他们的登录标记（在正文中）复制并粘贴到我的某些路由模板中（在我的情况下，@import "sb-admin-2.scss";模板b / c这不是一个真正的项目）。
- 然后我需要向主体添加一个类，所以我这样做了：
```
application.hbs
```

您可以在我的github上查看项目。祝你好运：）

如何将Bootstrap 4模板安装到Ember Web项目？

1 个答案: