svelte - 将 Autoprefixer 添加到 Svelte & Parcel 项目？

Question

我似乎无法让 autoprefixer 与 Parcel 和 Svelte 一起工作。我在 'svelte.config.js' 文件中有以下代码，但它似乎没有工作，即使它没有抛出任何错误。 Sass 正在正确编译，我有一个 .browserlistrc 文件。任何帮助将不胜感激!

const sveltePreprocess = require('svelte-preprocess');

module.exports = {
  preprocess: sveltePreprocess({
    scss: true,  
    postcss: {
        plugins: [require('autoprefixer')]
    }
  })
};

我安装了以下 devDependencies

  "devDependencies": {
    "autoprefixer": "^9.7.3",
    "parcel-bundler": "^1.12.4",
    "parcel-plugin-svelte": "^4.0.5",
    "postcss": "^7.0.26",
    "postcss-load-config": "^2.1.0",
    "sass": "^1.24.2",
    "svelte": "^3.16.5",
    "svelte-preprocess": "^3.3.0"
  }

Answer 1

svelte.config.js 适用于编辑器 - 更具体的语言服务器，不适用于您的 rollup 工具。查看文档here

1. postcss.config.js

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

1. .browserslistrc

> 1%

运行 npm run dev 或 npm run build 后，您将在您的 css 文件中看到这些供应商前缀，或者您可以在浏览器中查看。