css - 对 ember-cli-postcss 和 autoprefixer 毫 headless 绪

Question

我正在尝试使用 autoprefixer 进行 ember 构建。我遇到的问题是，通常输出到“assets/application-name.css”的内容现在输出到“app/styles/app.css”，我想将它输出到“assets/application-name.css” '.

我试过添加 outputPaths 选项，但似乎没有任何效果。

var EmberApp = require('ember-cli/lib/broccoli/ember-app');
var Funnel = require('broccoli-funnel');
var autoprefixer = require('autoprefixer');

module.exports = function(defaults) {
  var app = new EmberApp(defaults, {
    outputPaths: {
      app: {
        css: {
          'app': 'assets/application-name.css'
        }
      }
    },
    postcssOptions: {
      compile: {
        enabled: false
      },
      filter: {
        enabled: true,
        plugins: [
          {
            module: autoprefixer,
            options: {
              browsers: ['last 2 version']
            }
          }
        ]
      }
    }
  });
...

Answer 1

我今天开始了一个元素，遇到了同样的问题。我很幸运将 autoprefixer 插件转到了 compile 步骤而不是过滤步骤。

/* eslint-env node */
const EmberApp = require('ember-cli/lib/broccoli/ember-app'),
      autoprefixer = require('autoprefixer');

module.exports = function(defaults) {
  var app = new EmberApp(defaults, {
    postcssOptions: {
      compile: {
        enabled: true,
        plugins: [
          {
            module: autoprefixer,
            options: {
              browsers: ['last 2 version']
            }
          }
        ]
      },
      filter: {
        enabled: false,
      }
    }
  });
  return app.toTree();
};

如果版本对于此解决方案很重要:

ember-cli: 2.12.1

节点:6.10.2

ember-cli-postcss: 3.2.0