Skip to content

Config Files naming #501

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
2 of 4 tasks
kroko opened this issue Nov 24, 2020 · 1 comment · Fixed by #502
Closed
2 of 4 tasks

Config Files naming #501

kroko opened this issue Nov 24, 2020 · 1 comment · Fixed by #502

Comments

@kroko
Copy link

kroko commented Nov 24, 2020

Documentation Is:

  • Missing
  • Needed
  • Confusing
  • Not Sure?

Please Explain in Detail...

The docs state that

The loader will search up the directory tree for configuration in the following places:

  • a postcss property in package.json
  • a .postcssrc file in JSON or YAML format
  • a .postcss.json, .postcss.yaml, .postcss.yml, .postcss.js, or .postcss.cjs file
  • a postcss.config.js or postcss.config.cjs CommonJS module exporting an object (recommended)

I'm updating webpack stack for v5 and checking any changes in all loaders along the way.

  • It stood out that naming of the dotfiles has been changed.
  • Tried using .postcss.js instead of .postcssrc.js.
  • Naming PostCSS config file .postcss.js does not yield result, while naming it as previously .postcssrc.js does yield result (prefixes and minification).
  • .postcss.js is not mentioned, but .postcssrc.js is at postcss-load-config

An example:

.postcssrc.js

module.exports = (ctx) => ({
  plugins: [
    require('autoprefixer')({
      // browsers: [], // defined in .browserslistrc file!
      cascade: true,
      add: true,
      remove: false,
      supports: true,
      flexbox: true,
      grid: false
    }),
    ctx.env === 'development'
      ? null
      : require('cssnano')({
        // https://cssnano.co/guides/optimisations
        preset: ['default', {
          autoprefixer: false, // do not remove prefixes
          discardComments: {
            removeAll: true
          },
          normalizeUrl: false,
          normalizeWhitespace: true,
          zindex: false
        }]
      })
  ].filter((e) => e !== null)
});

.browserslistrc

[production staging testing]
> 0.0001%

[development]
last 1 version

Versions used:

    "autoprefixer": "^10.0.2",
    "css-loader": "^5.0.1",
    "cssnano": "^4.1.10",
    "postcss": "^8.1.9",
    "postcss-loader": "^4.1.0",
    "webpack": "^5.6.0",
    "webpack-cli": "^4.2.0"

Your Proposal for Changes

As I am not sure if it is error in the docs or the naming is "about to be changed". I'm proposing to revise the docs.

That is, maybe the docs are wrong and are missing the "rc" part in dotfile cases

  • a .postcssrc.json, .postcssrc.yaml, .postcssrc.yml, .postcssrc.js, or .postcssrc.cjs file

Thanks

@alexander-akait
Copy link
Member

Thanks, fixed #502

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants