ember-cli-postcss icon indicating copy to clipboard operation
ember-cli-postcss copied to clipboard

[Bug]: Conflicting with ember-cli-sass

Open bitbreakr opened this issue 3 years ago • 0 comments

Hi,

I had to install this add-on in order to use tailwindcss. It was working properly until I decided to use sass (scss) for productivity concerns.

My project does not build anymore

{
...,
 "ember": {
    "edition": "octane"
  },
}

ember-cli-build.js

'use strict';

const EmberApp = require('ember-cli/lib/broccoli/ember-app');
const autoprefixer = require('autoprefixer');
const tailwind = require('tailwindcss');
const nodeSass = require('node-sass');

module.exports = function (defaults) {
  let app = new EmberApp(defaults, {
    sassOptions: {
      extension: 'scss',
      implementation: nodeSass,
    },
    postcssOptions: {
      compile: {
        extension: 'css',
        // track changes in template, css, scss, and tailwind config files
        cacheInclude: [/.*\.(css|scss|hbs)$/, /.tailwind\/config\.js$/],
        plugins: [
          {
            module: autoprefixer,
            options: {},
          },
          {
            module: tailwind,
            options: {
              config: './tailwind.config.js',
            },
          },
        ],
      },
    },
  });

  // Use `app.import` to add additional libraries to the generated
  // output files.
  //
  // If you need to use different assets in different
  // environments, specify an object as the first parameter. That
  // object's keys should be the environment name and the values
  // should be the asset to use in that environment.
  //
  // If the library that you are including contains AMD or ES6
  // modules that you would like to import into your application
  // please specify an object with the list of modules as keys
  // along with the exports of each module as its value.

  return app.toTree();
};

Error output:

▲ (imac-pro-de-yan.home) ember-app [main] ember serve
Build Error (PostcssCompiler)

File not found: /app/styles/app.css
in any of the following include paths:
  /var/folders/hc/k6_6sdvd02132kfg7jvz91yc0000gn/T/broccoli-44775Av2103Xc3LS2/out-266-broccoli_merge_trees


Stack Trace and Error Report: /var/folders/hc/k6_6sdvd02132kfg7jvz91yc0000gn/T/error.dump.cf8c85ab41f90f0fea336d0e0a80e157.log

As you can see, it says the app.css is not here;, but it is in fact here. (see picture below)

Capture d’écran 2022-08-02 à 18 40 24

bitbreakr avatar Aug 02 '22 16:08 bitbreakr