postcss / postcss-cli

CLI for postcss
Other
840 stars 93 forks source link

Import only working #239

Closed Marzdor closed 6 years ago

Marzdor commented 6 years ago

When i was using v5 of postcss-cli my npm script was working fine now that i am using v6 it seems to only import my css and not run autoprefix or nested or mixins. Not sure if this is a issue or my config is outdated.

////// postcss.config.js //////
module.exports = () => ({
  plugins: {
    autoprefixer: {
      browsers: "> 5%"
    },
    "postcss-import": {},
    "postcss-nested": {},
    "postcss-mixins": {},
    "postcss-simple-vars": {}
  }
});

////// npm script I am using //////
"postcss": "postcss --config postcss.config.js -w src/assests/css/main.css -o src/assests/css/index.css"

////// main.css example //////
@import "modules/_nav.pcss";

////// _nav.pcss example //////
.nav {
  @mixin atSmall {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    justify-items: center;
    align-items: center;
    text-align: center;
    &-link {
      padding: 15px;
    }
  }
}

////// index.css result after running postcss script //////
.nav {
  @media (min-width: 320px) {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    justify-items: center;
    align-items: center;
    text-align: center;
    &-link {
      padding: 15px;
    }
  }
}
Marzdor commented 6 years ago

figured it out mixin had to go before nested for whatever reason.