Vue3 autoprefixer 配置问题

Question

我有一个使用 Vue-cli 3 使用 vue create my-new-project 创建的新项目。我正在使用 CSS 网格进行一些布局，我需要支持 IE11 和更新版本。 Vue 文档说 autoprefixer 是默认加载和启用的，但它不工作。我无法让它在 npm 运行 build 或 npm 运行 serve 中工作。在 chrome 中工作正常，但 IE11 不工作。我确定有一些配置需要完成，但我不确定那可能是什么。

.browserslistrc:

> 1%
last 4 versions

postcss.config.js:

module.exports = {
  plugins: {
    autoprefixer: {}
  }
};

Answer 1

CSS 默认禁用网格支持。
您可以使用 grid: autoplace 选项或 /* autoprefixer grid: autoplace */ 控件注释来启用它。

module.exports = {
  plugins: {
    'autoprefixer': {
      grid: 'autoplace'
    },
  }
};

Does Autoprefixer polyfill Grid Layout for IE?

Vue3 autoprefixer 配置问题

Vue3 autoprefixer config issue

webpack

vue.js

autoprefixer

vuejs2

vue-cli-3