我的 PostCSS 插件在 Vue-cli 3 项目中不起作用
My PostCSS plugin does not work in a Vue-cli 3 project
所以我写了这个 postcss 插件,我正在尝试使用它。我根据 postcss 指南对其进行了测试,在我尝试将其用于实际项目之前,它按预期工作。
这是 GitHub
上的 plugin
我正在尝试在 Vue-cli 应用程序 (Webpack) 中使用它。
我用 npm install
安装了插件。我也安装了 postcss & postcss-loader(我试过不同的版本,重新安装,但没有成功)
这是我的 postcss.config.js
module.exports = {
plugins: [
require("postcss-vwh"),
//...
],
};
更新
好的,所以我创建了一个新的最小应用程序(没有 vue,只有 Webpack 5,css-loaders,包括最新版本的 postcss 和插件)并且它工作不出所料!
所以显然问题毕竟不是我的插件,而是 vue-cli。经过几个小时的尝试使其工作后,我收到了这条错误消息:
Syntax Error: Error: PostCSS plugin postcss-vwh requires PostCSS 8.
研究表明,可以通过升级 postcss-loader 来修复此错误,但我被 vue-cli 强制使用版本 4,这是与 Webpack 兼容的最后一个版本4,我的 vue-cli 应用程序在其上运行。
那么,有什么方法可以让我的插件不那么苛刻吗?也许让它需要较低版本的 postcss,以便它可以与 Webpack 4 一起使用?
所以我从 PostCSS here 的创建者那里得到了一个答案,基本上是说,不建议尝试支持旧的 postcss 版本。最好的方法是更新 postcss。
所以我所做的就是告别 vue-cli,从头开始手动创建一个新的 Webpack 5 / vue 应用程序,将我的所有东西复制到那里,安装 postcss 8,现在它可以工作了。
所以我写了这个 postcss 插件,我正在尝试使用它。我根据 postcss 指南对其进行了测试,在我尝试将其用于实际项目之前,它按预期工作。
这是 GitHub
上的 plugin我正在尝试在 Vue-cli 应用程序 (Webpack) 中使用它。
我用 npm install
安装了插件。我也安装了 postcss & postcss-loader(我试过不同的版本,重新安装,但没有成功)
这是我的 postcss.config.js
module.exports = {
plugins: [
require("postcss-vwh"),
//...
],
};
更新
好的,所以我创建了一个新的最小应用程序(没有 vue,只有 Webpack 5,css-loaders,包括最新版本的 postcss 和插件)并且它工作不出所料!
所以显然问题毕竟不是我的插件,而是 vue-cli。经过几个小时的尝试使其工作后,我收到了这条错误消息:
Syntax Error: Error: PostCSS plugin postcss-vwh requires PostCSS 8.
研究表明,可以通过升级 postcss-loader 来修复此错误,但我被 vue-cli 强制使用版本 4,这是与 Webpack 兼容的最后一个版本4,我的 vue-cli 应用程序在其上运行。
那么,有什么方法可以让我的插件不那么苛刻吗?也许让它需要较低版本的 postcss,以便它可以与 Webpack 4 一起使用?
所以我从 PostCSS here 的创建者那里得到了一个答案,基本上是说,不建议尝试支持旧的 postcss 版本。最好的方法是更新 postcss。
所以我所做的就是告别 vue-cli,从头开始手动创建一个新的 Webpack 5 / vue 应用程序,将我的所有东西复制到那里,安装 postcss 8,现在它可以工作了。