vue开发中，build时css打包报错

最新推荐文章于 2024-06-28 18:19:03 发布

weixin_30834783

最新推荐文章于 2024-06-28 18:19:03 发布

阅读量714

点赞数

CC 4.0 BY-SA版权

文章标签： javascript webpack ViewUI

原文链接：http://www.cnblogs.com/YKSlu/p/7131694.html

本文介绍了解决Vue项目中多页面引入相同CSS文件导致的打包冲突问题。通过调整CSS文件引入顺序或在构建配置中进行设置，避免了Webpack打包时的错误提示。

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

vue在打包的时候css报错，首先声明的这个并没有解决webpack本身的问题，本来这个也是一个警示，不会影响代码正常运行

这个是因为我在多个页面引入了同一个css文件，webpack打包时候对css文件顺序报错，如果css少，可以稍微改动下css文件顺序即可，但是当很多文件引入的时候，就没法一个个改了，解决办法是在build的文件中加入

转载于:https://www.cnblogs.com/YKSlu/p/7131694.html

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_30834783

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

vue3 - 解决打包报错error: during build: Error: The service was stopped，vue3执行打包run build时无法打包并出错提示（报错详细解决）

高级前端工程师

06-18

2870

vue3，vite，打包出错，无法打包编译，npm run build，能正常运行开发但打包报错，Error: The service was stopped，vue3.x 打包出错怎么办，如何解决vue3 Error: The service was stopped无法打包的错误，vite-plugin-theme，extract css code file is successfully，打包报错，element plus组件库，jeecg vue3添加了element-plus组件，开发正常，打包报错

vue - 执行build打包报错Replace Autoprefixer browsers option to Browserslist config | Use browserslist key

最新发布

高级前端工程师

07-02

1751

vue2，vue3，vue-cli3，cli脚手架，npm run build，打包报错，无法打包，打包失败，vue-cli打包报错，vue脚手架执行打包命令后出现报错，postcss.config.js，修改postcss.config.js还是不行，postcss，autoprefixer，依旧报错怎么办，vue一直打包失败咋办，删除postcss下的autoprefixer配置项还不行，Replace Autoprefixer browsers option to Browserslist confi

参与评论您还未登录，请先登录后发表或查看评论

vue工程build后css样式失效问题

clark的专栏

01-12

3835

项目开发完成后，执行 npm run build 进行打包，将打包完成的dist文件部署在服务器。配置好域名解析，就可以实现工程上线。上线后，我们有时候会发现，它怎么和本地调试时长得不一样？长得不一样是样式问题，是打包的时候顺序先后问题，有一些样式没有生效，有一些样式被覆盖了。这时候可以考虑以下几种方法。 1.main.js样式引入顺序问题有时候我们发现组件内的样式没有生效，可...

VUE build的时候app css CssSyntaxError错误

shiki0083的笔记

08-06

917

跑npm run build时，运行node脚本压缩css时报错，所以这是css的问题去找就可以了。 (node:3172) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function...

vue run build 错误 CssSyntaxError错误

梧桐落叶~~

07-24

3383

错误代码 Error processing file: static/css/app.4ce01a6050060bff9b33c64750b6bd11.css (node:6544) UnhandledPromiseRejectionWarning: CssSyntaxError: C:\Users\0\Desktop\haha\static\css\app.4ce01a6050060bff9b3...

Vue项目进行webpack打包时出现css报错

Jason_Nevermind的博客

10-22

1426

在进行npm run build进行打包时出现报错: Unknow word 解决方案暂时注释掉OptimizeCSSPlugin相关配置，等待问题解决后恢复。 1.找到build/webpack.prod.conf文件，注释掉此plugin 2.再次打包：npm run build 此时打包成功 3.在生成的dist中查找出现问题的css，定位到具体样式此时发现是em标签出现问题，根据上下样式查找出原样式表的相应位置及属性 4.查找样式表问题的对应位置并进行修改 5.更改后放开插件注释并重新b

使用vue-cli2打包项目时，显示css和js报错（Failed to load resource: net::ERR_FILE_NOT_FOUND）

weixin_42536961的博客

08-07

829

1.首先第一步，找到config文件夹下的index.js 找到build的位置 build: { // Template for index.html index: path.resolve(__dirname, '../dist/index.html'), // Paths assetsRoot: path.resolve(__dirname, '../dist'), assetsSubDirectory: 'static', assetsPublic

用Vue-cli搭建的项目中引入css报错的原因分析

08-29

5. 在开发Vue-cli项目时，需要注意css文件的路径问题，正确地配置css文件的路径可以避免许多报错的问题。结语本文详细介绍了Vue-cli项目中引入css报错的问题原因分析和解决方法。希望这个解决方法能够帮助大家在...

解决vue2中使用elementUi打包报错的问题

10-14

在Vue2项目中，ElementUI是一个非常流行的UI组件库，但在使用过程中，有时会出现打包报错的情况。本文将深入探讨两种常见的打包错误及其解决方案。 **错误1：找不到`element-ui/lib/theme-default/index.css`** 这...

解决vue build打包之后首页白屏的问题

08-27

在开发Vue.js应用时，我们通常会使用`npm run build`命令将项目打包为生产环境版本。然而，有时候在执行这个命令后，发现打包后的应用在浏览器中打开时会出现首页白屏的情况。这个问题可能由多种原因引起，但最常见...

vue 打包生产环境报错 UnhandledPromiseRejectionWarning: CssSyntaxError:

晓风揽月

01-15

1383

采坑血泪史。。。打包忽然抛错，如图，怀疑依赖没下载完整，然后卸载安装一下午，然并卵，后在博主贴子找到思路，报错信息如下，css压缩时出现错误：！！！！关注这里，红色框里的关键信息UnhandledPromiseRejectionWarning: CssSyntaxError: 解决方案：打开配置文件 build-->webpack.prod.conf.js，文件内查找OptimizeCSSPlugin ，找到后先注释，如下图先尝试注释，然后打包，发现可以打包成功。备注：出错原...

vue打包遇到的问题

songhsia的博客

08-06

931

一、项目中使用了sass，以src形式引入，然而在进行打包时未成功，报错显示unknown word 思路：这种可能是多种原因造成的，这里只给大家提供一种思路：可能是scss文件中使用了'//'这样的注释方法，导致'//'后面的代码都被注释掉，所以无法解析。解决： 1.将webpack.prod.config.js中的以下代码注释 //const OptimizeCSSPlugin ...

关于vue报错This relative module was not found: * ./assets/css/bootstrap.min.css in ./src/main.js

weixin_42476786的博客

09-13

2万+

当我将我的vue项目更换目录提交后报出了这个错误，想起了vue引入jquery和bootstrap时的问题。所以我尝试着重新执行了引入jquery和bootstrap，步骤如下：也就是分别执行了： cnpm install jquery –save-dev cnpm install style-loader –save-dev cnpm install css-loade...

Conflicting order. Following module has been added:

热门推荐

刹那的博客

07-16

2万+

webpack打包时，通常会将css和js文件打包到一起，此时我们会使用mini-css-extract-plugin插件分离并打包css到单独文件。 mini-css-extract-plugin插件使用问题 Conflicting order 常遇到如下警告，Conflicting order. Following module has been added:…。此警告意思为在不同的js中引用相同的css时，先后顺序不一致。也就是说，在1.js中先后引入a.css和b.css，而在2.js中引入的却是

亲手搭建vue项目的过程--Module build failed: Unknown word,无法读取css文件

HQ DevJ的专栏

05-19

7776

执行webpack-dev-server的时候就报错了，报错如下： ERROR in ./src/components/app.vue?vue&type=style&index=0&id=6c0a0fc1&scoped=true&lang=css& (./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_...

1使用预处理器sass 2开发模式反向代理配置

jieweiwujie的博客

07-26

582

开发模式反向代理配置

vuecli3打包报错chunk chunk-4247e1a6 [mini-css-extract-plugin] Conflicting order. Following module ha

asdfghjkl02563的博客

10-29

1250

运行num run build 打包成功但是提示以下错误解决：在vue.config.js 配置文件里添加下面的配置，打包时禁用顺序检查 css: { extract: process.env.NODE_ENV === "production" ? { ignoreOrder: true } : false }, ...

css样式构建后缺失和生效不及时加时间戳

sinat_36017053的博客

02-02

184

构建缺失图片

打包警告：chunk common [mini-css-extract-plugin]Conflicting order between:

m0_62651421的博客

06-28

840

mini-css-extract-plugin 生产环境打包的时候会启用，css引入顺序不一致就会发出警告；- vue.config.js配置。或者：调整组件引入的顺序。

vue2打包报错——error in css/app.b9045713.css（css/app.b9045713.css from Css Minimizer plugin）

weixin_44479794的博客

05-11

1949

使用vue2+elementUI写了一个门户网站，在打包时遇到一个报错error in css/app.b9045713.css，报错截图如下一开始百度上找不到，交流群也问了个遍，都没有有效的解决方法，以为是Css Minimizer plugin的问题，实际上和这个插件并没有关系，但是通过排除法猜测可能和css有关系，于是逐个页面排除css样式，终于发现了，原因是我在style里使用了“//”的方法进行注释，因为当时样式是网速复制下来的，就没在意。虽然是因为我的粗心大意导致出现这个问题，不.