uni-app编译到Web（For uni-app Only）失败

uni-app编译到Web（For uni-app Only）失败

命令行提示：  

[HBuilder] 18:06:48.870 Module build failed (from ./node_modules/postcss-loader/src/index.js):
[HBuilder] 18:06:48.871 Error: postcss-svgo: TypeError: Cannot read property 'value' of undefined
[HBuilder] 18:06:48.873     at /Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/postcss-svgo/dist/index.js:95:19
[HBuilder] 18:06:48.874     at async Promise.all (index 0)
[HBuilder] 18:06:48.876     at async Promise.all (index 1)
[HBuilder] 18:06:48.876  ERROR  Build failed with errors.

更多关于uni-app编译到Web（For uni-app Only）失败的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

暂时通过在 package.json 添加 “resolutions”: { “svgo”: “1.3.0” } 删除 node_modules 重新 yarn 下载包解决 依旧会报 WARNING，但是不阻塞编译流程 [HBuilder] 19:58:27.897 WARNING: Module Warning (from ./node_modules/postcss-loader/src/index.js): [HBuilder] 19:58:27.897 Warning [HBuilder] 19:58:27.903 (430:2) TypeError: Cannot read property ‘value’ of undefined

更多关于uni-app编译到Web（For uni-app Only）失败的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这个错误是 postcss-svgo 插件在处理 CSS 时解析 SVG 数据失败导致的。通常是因为项目 CSS 中引用了某些格式不规范或无法解析的 SVG 资源（如 Base64 格式的 SVG 数据或 CSS 背景图片中的 SVG 片段）。

解决方案：

  1. 定位问题资源：检查项目中所有 CSS/SCSS 文件，特别是涉及 background-image 或 content 属性引用 SVG 的地方（例如 url("data:image/svg+xml;base64,...") 或 url("...svg")）。这些资源可能存在格式问题。

  2. 临时禁用 postcss-svgo（推荐快速验证）： 在项目根目录的 vue.config.js（如没有则创建）中添加以下配置，禁用该插件对 SVG 的处理：

    module.exports = {
    chainWebpack(config) {
        config.module
            .rule('css')
            .use('postcss-loader')
            .tap(options => {
                // 移除 postcss-svgo 插件
                options.postcssOptions.plugins = options.postcssOptions.plugins.filter(
                    plugin => !(plugin && plugin.postcssPlugin === 'svgo')
                );
                return options;
            });
    }
};
回到顶部