Ember-Cli SASS设置

Question

我使用ember-cli-sass代替broccoli-ruby-sass

这些是我已经完成的步骤

npm install --save-dev ember-cli-sass

bower install --save foundation

我在启动ember server

后在控制台中收到此错误

我不明白为什么它说“找不到档案：/app/styles/app.scss”

我没有任何app.scss来自

我在配置中遗漏了什么，究竟是什么问题？

我正在使用三个sass文件

_global.sass
_music.sass
_player.sass

我在app.sass中导入它们

@import global
@import player
@import music

我正在阅读https://www.npmjs.com/package/ember-cli-sass并且说

在config / environment.js中指定一些包含路径：

ENV.sassOptions = {
  includePaths: [
    'bower_components/foundation/scss'
  ]
}

我对这些设置感到有点困惑，我需要一些建议

Answer 1

我认为您收到错误是因为您可能没有将app.css文件的名称更改为app.scss

你的app/styles文件夹中你应该在该文件中有一个名为app.scss的文件我会把你的导入

// app.scss
   @import 'foundation';
   @import 'global';
   @import 'player';
   @import 'music';

然后你需要添加：

ENV.sassOptions = {
  includePaths: [
    'bower_components/foundation/scss'
  ]
}

以这样的config/environment.js：

module.exports = function(environment) {
  var ENV = {
    modulePrefix: 'test-sass',
    environment: environment,
    baseURL: '/',
    locationType: 'auto',
    sassOptions: {
      includePaths: [
        'bower_components/foundation/scss'
      ]
    },
    EmberENV: {
      FEATURES: {
   .....

如果您希望在ember-cli app中使用基础，请使用ember-cli插件：https://www.npmjs.com/package/ember-cli-foundation-sass

Answer 2

我认为默认情况下ember-cli-sass会查找扩展名为.scss的sass文件。如果您使用.sass的文件扩展名，则需要在sassOptions中指定它。

ENV.sassOptions = {
  includePaths: [
    'bower_components/foundation/scss'
  ],
  extension: 'sass'
}

检查https://github.com/aexmachina/ember-cli-sass