将 Autoprefixer 添加到 Svelte & Parcel 项目？答案

【问题标题】：Adding Autoprefixer to a Svelte & Parcel project?将 Autoprefixer 添加到 Svelte & Parcel 项目？
【发布时间】：2020-04-25 20:58:18
【问题描述】：

我似乎无法让 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"
  }

【问题讨论】：

标签： svelte postcss parcel autoprefixer

【解决方案1】：

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

postcss.config.js

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

.browserslistrc

> 1%

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

【讨论】：