eyeix
V2EX  ›  问与答

Nextjs 样式问题求解

  •  
  •   eyeix · Jan 17, 2021 · 886 views
    This topic created in 1953 days ago, the information mentioned may be changed or developed.

    最近在使用 Nextjs + sass

    在配置 nextjs 的过程中,一直无法解决 scss 全局变量的实现以及组件间 css 模块化的实现。

    导致样式覆盖的问题,全局变量的 scss 还要每个样式文件 import 一次

    查了半天也没找到有效的解决方式

    还请大佬们指点一下(*  ̄︿ ̄)

    下面这俩都试过了。。。

    /// next.config.js
        // 全局变量和 mixin
    config.module.rules.push({
          enforce: 'pre',
          test: /.scss$/,
          loader: 'sass-resources-loader',
          options: {
              resources: ['/styles/_variables.scss'],
          }
      });
    
    /// next.config.js
    
        // css 模块化
    cssModules: true,
      cssLoaderOptions: {
          importLoaders: 1,
          // scoped class 格式
          localIdentName: "[local]__[hash:base64:5]",
      },
    
    No Comments Yet
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   6097 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 241ms · UTC 02:08 · PVG 10:08 · LAX 19:08 · JFK 22:08
    ♥ Do have faith in what you're doing.