Why doesn't Autoprefixer work in create-react-app and how to properly organize work with pre/post CSS in a React.js application?

P

Pavel Kizernis2019-12-14 17:10:17

css

Pavel Kizernis, 2019-12-14 17:10:17

I am new to React. Started using create-react-app .
Before that, I always wrote in pure CSS. Now I'm learning Sass and Autoprefixer.
I see in the documentation that npm run ejectboth Sass and Autoprefixer should work out of the box (i.e. without the command ).
Everything worked with Sass, but Autoprefixer does not work in any way.
browserslist tried this one for testing:

"browserslist": {
    "production": [
      "since 2010"
    ],
    "development": [
      "since 2010"
    ]
  },

In this regard, the questions are:
How should CSS be organized in the application?

Write BEM styles in each scss file and import them into each react component?
How should Autoprefixer work in this case? Do I need to use html-autoprefixer in this case ? the compiled CSS ends up in the HTML in the ?<head>
Import the main main.scss into index.js, inside which we already collect all the rest via import?
How should Autoprefixer work in this case?

How do I set up this bundle PreCSS (sass) -> CSS -> PostCSS (autoprefixer) ?