postcss-import: Duplicate when importing

Hi, I’m not sure if it’s a bug or something I misunderstood.

With webpack, I import the same file in two different css files but it gets inlined twice.

A.css:
@import "core/cssutils.css";

B.css:
@import "core/cssutils.css";

core/cssutils.css:
body {
  font-family: verdana;
}

Webpack:
  postcss: function() {
    return [
      postcssImport
    ]
  },

Final result:
body{font-family:verdana}body{font-family:verdana}

About this issue

Original URL
State: closed
Created 8 years ago
Reactions: 5
Comments: 30 (6 by maintainers)

Most upvoted comments

Did you mean to leave "postcss-import" in that config? Seems you are saying that I convert colors.css to colors.json and provide it through the postcss-cssnext config? In that case there’s no point to "postcss-import" anymore?

aaronbeall on Dec 4, 2017

postcss.config.js

// colors.css => colors.json
const variables = require('path/to/colors.json')
// or 'inline'
// const variables = { ...colors }

module.exports = {
  plugins: {
-    "postcss-import": {},
    "postcss-cssnext": {
        features: {
           customProperties: { variables }
        }
     }
  }
}

michael-ciniawsky on Dec 4, 2017

We have indeed a test to ensure there is no duplicates by default.

MoOx on Nov 25, 2016