facebook / create-react-app

Set up a modern web app by running one command.
https://create-react-app.dev
MIT License
102.73k stars 26.85k forks source link

Autoprefixer doesn't work out of the box #9903

Open xitanggg opened 4 years ago

xitanggg commented 4 years ago

Describe the bug

In the Create React App doc, it says

This project setup minifies your CSS and adds vendor prefixes to it automatically through Autoprefixer so you don’t need to worry about it.

This doesn't seem to be true however.

Steps to reproduce

npx create-react-app my-app
cd my-app
npm run build

When I inspect build/static/css/main.xxx.chunk.css, I expect to see

.App-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;

but I get

.App-header {
  display: flex;
stale[bot] commented 3 years ago

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

Saibamen commented 3 years ago

 d

imjeen commented 3 years ago

meet the same problem when using the latest CRA (react-scripts@4.0.1)

yarn build and the result CSS like below:

.wrapper{
    display: flex;
    justify-content: center;
    align-items: center;
}

and the value was not been computed:

.amd-form-item-default-label {
    flex-basis: 173 * 0.5 * 1px;
    margin-right: 24 * 0.5 * 1px;
}

Last, I made sure again that my configuration is correct in package.json:

"browserslist": {
    "production": [
      "Android >= 5.0",
      "Chrome >= 60",
      "iOS >= 9"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }