运行vue项目: ERROR Failed to compile with 6 errors;; error in ./src/views/common/404.vue解决方案

首先运行:

cnpm run dev

在这里插入图片描述
第一步:

npm uninstall --save node-sass

第二步:

npm install --save node-sass

第三步:

npm run dev

接着报错了
在这里插入图片描述
第4步:

npm i

第5步:

cnpm i 

第6步:

npm uninstall --save node-sass

第7步:

npm install --save node-sass

第8步:

npm run dev

成功页面:
在这里插入图片描述
在这里插入图片描述

### 解决 Webpack 编译错误以及 `pdf.js` 文件中 `Unexpected character '#'` 的问题 在 Vue 项目中遇到 Webpack 编译错误时,通常可以通过调整 Webpack 配置来解决问题。以下是针对 `pdf.js` 文件中的 `Unexpected character '#'` 错误的具体解决方案。 #### 修改 `vue.config.js` 配置 为了处理 `pdf.js` 文件中的特殊字符(如 `#`),可以使用 `raw-loader` 或者自定义加载器来解析这些文件。通过修改 `vue.config.js` 来添加特定的规则: ```javascript module.exports = { chainWebpack: (config) => { config.module .rule('pdf') .test(/\.js$/) .include.add(/node_modules\/pdf\.js\//).end() // 指定 pdf.js 路径 .use('babel-loader') // 使用 Babel 加载器转换 JavaScript .loader('babel-loader') .tap((options) => ({ ...options, presets: ['@babel/preset-env'], // 确保兼容性 })) .end() .use('raw-loader') // 添加 raw-loader 处理特殊字符 .loader('raw-loader'); }, }; ``` 上述配置的作用是为 `pdf.js` 提供额外的支持,确保其能够被正确解析并避免因特殊字符引起的语法错误[^1]。 #### 关于 `transpileDependencies.map is not a function` 报错 如果在开发过程中遇到了类似的依赖项转译错误,则可以在 `vue.config.js` 中显式声明需要忽略的依赖列表。例如: ```javascript module.exports = { transpileDependencies: [], // 明确指定为空数组以防止 map 方法调用失败[^2] }; ``` 此设置可有效规避由于某些插件未正确定义而导致的功能异常。 #### 替换第三方库版本号 对于由具体组件引发的问题(比如 `@antv/layout` 下的矩阵计算模块报错),尝试降级相关联的 npm 包至稳定版可能是有效的解决办法之一。根据已有经验,“ml-matrix”的第 6.10.x 版本表现更为可靠;因此建议将其锁定到 `"version": "6.10.2"` 并重新安装依赖关系[^3]: ```bash npm install ml-matrix@6.10.2 --save-dev ``` 完成更新之后再次运行构建命令验证修复效果如何。 --- ### 总结 综合以上方法,主要从三个方面入手解决了 Webpack 编译期间可能发生的各类潜在障碍: 1. 自定义 Webpack 规则适配复杂场景下的资源加载需求; 2. 清晰界定需特别对待的外部包集合以防意外冲突发生; 3. 定位不稳定因素所在并通过回退策略恢复服务稳定性。 希望这些建议能帮助您顺利完成项目的部署工作! ---
评论 10
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值