Webpack中使用css配置问题（ Can‘t resolve ‘style-loader‘）

最新推荐文章于 2023-11-15 15:54:57 发布
最新推荐文章于 2023-11-15 15:54:57 发布
阅读量3.1k 收藏 2
点赞数 8
分类专栏： 前端 vue webpack 文章标签： vue.js webpack vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43440751/article/details/115068341
版权
前端 同时被 3 个专栏收录
8 篇文章 0 订阅
订阅专栏
vue
6 篇文章 0 订阅
订阅专栏
webpack
1 篇文章 0 订阅
订阅专栏

webpack使用css配置问题

ERROR in ./src/main.js
Module not found: Error: Can’t resolve ‘style-loader’ in ‘D:\WEB前端\webpack\01-webpack的使用\03-webpack的loader’
@ ./src/main.js 6:0-27

奶奶个腿的，一个小破问题搞了我一上午，网上各自墨迹也没解决我的问题，气的我脑瓜子嗡嗡的。报错如上。
当你运行npm run build指令就报这个错误，那么就看我这篇就行了。
原因就是你没有安装style-loader
给我安装它！
直接控制台在你对应目录下输入
npm install --save-dev style-loader

再继续输入你之前那个破命令npm run build

成功！

还有问题欢迎评论 私聊！

健身三年的前端小白
关注
  • 8
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 9
    评论
专栏目录
fast-sass-loader：用于webpack的高性能sass loader
02-06
提示：与一起使用，您将获得10倍以上CSS构建性能特征： 在大型SASS项目中比sass-loader快sass-loader倍支持sass文件重复数据删除，永远不用担心@import在不同位置@import相同文件支持url解析，永远不用担心url(...)...
Webpack 之 babel-loader文件预处理器详解
08-27
Webpack 是一个现代JavaScript...在实际项目中，你可能还需要结合其他loader，如`style-loader`、`css-loader`等处理CSS和其他资源，构建完整的前端构建流程。了解并熟练运用这些工具，是现代Web开发中必不可少的技能。
使用style-loader时报错：Can‘t resolve ‘style-loader‘
qq_45327886的博客
10-10 7232
Can't resolve 'style-loader'
webpack Can't resolve 'style-loader'
Heart_xieying的专栏
10-09 978
Module not found: Error: Can't resolve 'style-loader' in 当报这个错时，要把：webpack.config.js 从 ,{test: /\.css$/, loader: "style-loader!css-loader" } 改为： ,{ test: /\.css$/, loader: "vue-style-loader!css-...
vue 'Can't resolve 'style-loader''
weixin_34304013的博客
03-13 1547
在命令行中输入 cnpm install style-loader css-loader 即可解决 转载于:https://www.cnblogs.com/shira-t/p/8556952.html
【板栗糖GIS】项目运行出现Can‘t resolve ‘stylus-loader‘ in问题
weixin_46192906的博客
03-20 1279
Can't resolve 'stylus-loader' in
webpack 错误提示 Error: Can't resolve 'css-loader'或Error: Can't resolve 'style-loader'
weixin_30297281的博客
11-17 513
报错提示 1.网上查资料发现原来'css-loader'和'style-loader'是被我全局安装了 2.正确做法cnpm install css-loader style-loader --save 3.打包运行成功 转载于:https://www.cnblogs.com/Cavalary/p/7852817.html...
完美解决webpack打包css背景图片路径问题
11-20
在Webpack的配置中，通常会使用`css-loader`来处理CSS文件，如下所示： ```javascript { test: /\.(css|less)$/, exclude: path.resolve(__dirname, 'node_modules'), use: ['style-loader', 'css-loader', 'less...
svelte-loader-hot:Webpack加载器，用于具有HMR支持的苗条组件
05-01
总之，虽然`svelte-loader-hot`曾经提供了Svelte组件的HMR支持，但现在已被官方弃用。开发者应遵循官方推荐的方式，直接使用最新的Svelte和Webpack集成来获得内置的HMR功能，这样既简单又高效。在使用Svelte进行开发...
webpack加载css文件及其配置方法
11-21
要使Webpack能够处理CSS，我们需要在入口文件中使用`require`或`import`语句引入CSS文件，例如： ```javascript require('./styles.css'); ``` 然而，这样做后直接运行`npm run build`会遇到错误，提示缺少处理CSS...
vue-cli下的项目出现Module not found: Error: Can't resolve 'stylus-loader'错误解决方案。
热门推荐
SilenceJude的博客
08-16 3万+
问题描述： 在慕课网学习vue课程，使用import导入header.vue文件时候，出现错误。 经检查，文件路径没有问题。 查看8080端口网页的结果，对错误信息描述的更清楚，导致错误的原因是 Can’t resolve ‘stylus-loader’，原来是因为我没有安装stylus和stylus-loader。 解决方案： 找到问题后，解决问题就简单多了。 使用如下命...
vue项目出现Module not found: Error: Can‘t resolve ‘stylus-loader‘错误解决方案
w36680130的博客
10-05 2243
vue项目出现Module not found: Error: Can't resolve 'stylus-loader'错误解决方案
vue项目出现Module not found: Error: Can't resolve 'stylus-loader'错误解决方案
weixin_30612769的博客
05-22 6974
因为没有安装stylus和stylus-loader npm install stylus stylus-loader --save-dev 安装成功后，使用npm install重新建立依赖 打开项目代码，找到package.json,查看文件中是否已经添加stylus和stylus-loader的版本信息。 转载于:https://www.cnblogs.com/wxy...
vue中写样式是报Error: Can‘t resolve ‘sass-loader‘
liweidecsdn的博客
08-10 481
1.在终端输入： npm install sass-loader -D 2.继续输入：npm install node-sass -D （入无法加载成功的话：输入 cnpm install node-sass -D） 即可
Cannot read property ‘style-resources-loader‘ of undefined
ITLISHUANG的博客
06-19 5567
写在前：当前环境是vue3, vue-cli4新建项目。安装过 'style-resources-loader'之后报错； 报错内容：Cannot read property 'style-resources-loader' of undefined；
webpack打包命令-Module not found: Error: Can‘t resolve
qq_41887644的博客
07-14 1611
原因：版本问题 解决方法:加-o webpack ./src/main.js -o ./dist/bundle.js
webpack打包： 报错ERROR in ./src/index.jsModule not found: Error: Can‘t resolve
最新发布
full_moon_的博客
11-15 2243
1. 创建一个webpack目录，在里面创建dist目录和src目录；在src目录中创建mathUtils.js和main.js。在使用webpack前端模块化打包工具时，出现 Error: Can't resolve。在终端输命令：webpack ./src/main.js ./dist/bundle.js。6. 在index.html中引用，运行index.html。5. dist目录下成功生成bundle.js。4. 使用webpack将两个js打包。报错，我的问题是因为。
vue3 安装sass出现can‘t resolve ‘sass-loader‘的解决方法
qing_xing_的博客
07-05 1467
npm install sass-loadernpm install node-sassnpm install sass-loadernpm install sassnpm install style-loadernpm install style-resources-loader将上面的依赖全部安装一遍如果没有在config里面配置 需要配置一下const path = require("path"); module.exports = { pluginOptions: {
前端项目启动时遇到 Can‘t resolve ‘lodash.difference‘ 这样的报错的解决
yulongguiyin的博客
04-06 985
如果是的，删除依赖包后,运行命令 npm i 重新安装依赖，就会发现之前的问题不再出现了。
Can't resolve 'stylus-loader'
09-14
引用:你遇到的错误是"Can’t resolve 'style-loader ’ in xxxx"，这个错误通常发生在webpack打包过程中无法找到所需的loader。根据你提供的信息，你需要解决的问题是"Can't resolve 'stylus-loader'"。为了解决这个问题，你可以按照以下步骤进行操作。 首先，确认你是否已经在项目中安装了stylus-loader。你可以通过运行npm install stylus-loader命令来安装它。如果已经安装了stylus-loader，但仍然报错，那么可能是webpack配置文件中的loader配置有误。 接下来，你可以检查你的webpack配置文件（通常是webpack.config.js）中的loader配置。确保你的stylus-loader的配置正确无误。你可以参考以下示例来修改loader配置： { test: /\.styl$/, use: ['style-loader', 'css-loader', 'stylus-loader'] } 这个示例中，我们使用了style-loader、css-loader和stylus-loader来处理.styl文件。你可以根据你的项目需求进行适当的修改。 最后，重新运行webpack打包命令，看看是否解决了问题。如果仍然报错，请确保你的stylus-loader的版本与其他loader的版本兼容，并尝试升级或降级loader来解决兼容性问题。 总结起来，解决"Can't resolve 'stylus-loader'"的问题，你可以先确保stylus-loader已经安装，并检查webpack配置文件中的loader配置是否正确。如果问题仍然存在，可以考虑检查loader的版本兼容性，并进行相应的升级或降级。希望这些步骤对你有帮助。
评论 9
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值