如何在 Ember 应用程序中输出多个 css 文件

How to output multiple css files in Ember app

我正在进行 ember 构建,我有 3 个样式表需要编译成它们自己的样式表。

这是 ember-cli-build.js 默认情况下的样子

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

module.exports = function(defaults) {
  let app = new EmberApp(defaults, {
    'ember-cli-foundation-6-sass': {
      'foundationJs': 'all',
    },
  });

这就是我尝试过的方法,但我没有看到生成新文件。文件路径正确。

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

module.exports = function(defaults) {
  let app = new EmberApp(defaults, {
    'ember-cli-foundation-6-sass': {
      'foundationJs': 'all',
    },
    css: {
      '/components/icons.data.svg': '/assets/icons.data.svg.css',
      '/components/icons.data.png': '/assets/icons.data.png.css',
      '/components/icons.fallback': '/assets/icons.fallback.css',
    },
  });

CLI 文档的这一部分可能会有用:https://cli.emberjs.com/release/advanced-use/asset-compilation/#configuringoutputpaths

基本上你可以这样设置:

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

module.exports = function(defaults) {
  let app = new EmberApp(defaults, {
    'ember-cli-foundation-6-sass': {
      'foundationJs': 'all',
    },
    outputPaths: {
      app: {
        css: {
          'components/icons.data.svg': '/assets/icons.data.svg.css',
          'components/icons.data.png': '/assets/icons.data.png.css',
          'components/icons.fallback': '/assets/icons.fallback.css'
        }
      }
    }
});

左边的键不应包含扩展名,因为支持后处理,所以我不确定您的文件是如何设置的(如果您显示的文件有 css 扩展名)。