新版 nuxt 使用 postcss

最新推荐文章于 2025-06-30 17:14:41 发布

Young_Gao

最新推荐文章于 2025-06-30 17:14:41 发布

阅读量5.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： vue 文章标签： vue nxut postcss

本文链接：https://blog.youkuaiyun.com/Young_Gao/article/details/92840518

vue 专栏收录该内容

38 篇文章

订阅专栏

博客介绍了在Nuxt中使用PostCSS的相关操作，首先需进行安装，然后在nuxt.config.js的build中添加代码，还给出了Nuxt官网关于PostCSS插件的解决办法链接。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先安装一波

npm install --save-dev postcss-nested postcss-responsive-type postcss-hexrgba

然后在 nuxt.config.js 里面的 build 中添加如下代码（官网给出的解决办法）

postcss: {
      // 添加插件名称作为键，参数作为值
      // 使用npm或yarn安装它们
      plugins: {
        // 通过传递 false 来禁用插件
        'postcss-url': false,
        'postcss-nested': {},
        'postcss-responsive-type': {},
        'postcss-hexrgba': {}
      },
      preset: {
        // 更改postcss-preset-env 设置
        autoprefixer: {
          grid: true
        }
      }
    },

nuxt 官网传送门：https://zh.nuxtjs.org/faq/postcss-plugins