zoukankan      html  css  js  c++  java
  • 【已解决】React中配置Sass引入.scss文件无效

    React中配置Sass引入.scss文件无效

    在react中使用sass时,引入.scss文件失效
    尝试很多方法没法解决,最终找到解决方法,希望能帮助正在坑里挣扎的筒子~

    在node_modules文件夹下,找到react-scripts ==> config文件夹, 在该配置文件夹下找到 webpack.config.dev.jswebpack.config.prod.js
    file-loader之前添加style-loader, css-loader, sass-loader
    代码如下:

              {
                test: /.scss$/,
                loaders: ['style-loader', 'css-loader', 'sass-loader'],
              },
              // "file" loader makes sure those assets get served by WebpackDevServer.
              // When you `import` an asset, you get its (virtual) filename.
              // In production, they would get copied to the `build` folder.
              // This loader doesn't use a "test" so it will catch all modules
              // that fall through the other loaders.
              {
                // Exclude `js` files to keep "css" loader working as it injects
                // its runtime that would otherwise processed through "file" loader.
                // Also exclude `html` and `json` extensions so they get processed
                // by webpacks internal loaders.
                exclude: [/.(js|jsx|mjs)$/, /.html$/, /.json$/],
                loader: require.resolve('file-loader'),
                options: {
                  name: 'static/media/[name].[hash:8].[ext]',
                },
              }
    
  • 相关阅读:
    tp5.前端模板注释
    站在历史天空下的幻想——高考感怀七十二韵
    公交查询
    模糊查询
    ibox 的使用
    tabs 导航 及内容切换
    c#ADO.NET 执行带参数及有返回数据
    Sql Server中变的定义以及赋值的应用
    EF的3种开发模式
    php7.1.30 下微信公众号问题
  • 原文地址:https://www.cnblogs.com/huiwenhua/p/8783223.html
Copyright © 2011-2022 走看看