css-modules相关内容

Gatsby-Warn尝试导入错误:';css';不包含默认导出(导入为';样式';)

我从Gatsby开始,在我的应用程序中,当我运行命令时 ‘Gatsby Developer’,我在终端中收到了这样的警告: 警告尝试导入错误:‘../Style/home.mode.css’不包含默认导出(作为‘Style’导入)。 然后,当我尝试加载页面时,这是不可能的 Unhandled Runtime Error Cannot read property 'header' ..
发布时间:2022-03-30 18:12:02 前端开发

带Selenium的CSS模块?

我正在使用Reaction/Redux和CSS模块开发一个Web应用程序。对于单元测试,我使用identity-obj-proxy模拟我的CSS导入。 然而,QA团队想知道在使用Selenium(我自己完全不熟悉)时如何处理模糊的类名。我只能找到is this question中提到的这两个组合,但QA不清楚接受的答案。 在这种情况下使用硒有哪些解决方案(最好是一个简单易懂的答案,我可 ..

:global() css-module 选择器在 NextJS 中不是纯的问题

所以我正在将一个应用程序从 CRA 迁移到 NextJS,我遇到了一些组件和页面的 .module.scss 文件的错误: 语法错误:选择器“:global(.label-primary)"不是纯的(纯选择器必须至少包含一个本地类或 id) 对于所有 :global 和 :local css-module 选择器,我都会收到此错误.根据我的搜索,我可以通过将选择器包装在一个类中并编辑 jsx ..
发布时间:2022-01-08 22:55:53 前端开发

无法导入 CSS/SCSS 模块.TypeScript 说“无法找到模块"

我正在尝试从 CSS 模块导入主题,但 TypeScript 出现“无法找到模块"错误,并且该主题未应用于运行时.我认为我的 Webpack 配置有问题,但我不确定问题出在哪里. 我正在使用以下工具: "typescript": "^2.0.3""webpack": "2.1.0-beta.25""webpack-dev-server": "^2.1.0-beta.9"“反应":“^ 15 ..
发布时间:2021-12-18 17:46:46 其他开发

如何使用 Antd/Less 和 Sass/CSS 模块配置 Next.js

我想将 Next.js 与 Sass 和 CSS 模块一起使用,但也想使用 Ant Design 并希望使用 Less 样式来实现更小的建筑尺寸. 我可以启用 CSS 模块或 Less 加载程序,但不能同时启用.Next.js 中的示例并没有帮助我解决这个问题. 解决方案 经过几个小时的研究,我现在终于找到了正确的解决方案,并想分享它: .babelrc(这里没有魔法) {“ ..
发布时间:2021-11-11 03:23:50 其他开发

css模块对象导入返回空

我正在尝试在 react 中使用 css 模块,但它不起作用. 这段代码的日志: 从 'react' 导入 React从“../../css/test.css"导入样式类测试扩展了 React.Component {使成为() {控制台日志(样式)返回 ( 此文本将是蓝色的 );}}导出默认测试 返回对象{} 并且呈 ..
发布时间:2021-09-23 19:16:12 其他开发

如何修复 css 文件上的打字稿编译器错误?

我正在尝试使用 webpack 创建一个带有打字稿的 React 项目.但我无法让 CSS 模块正常工作.尝试在打字稿中导入 CSS 文件时,我不断收到此错误: src/components/Button.module.css 中的错误:1:0[未知]:解析错误:预期的声明或语句.>1 |.myButton {2 |框阴影:0px 0px 0px -1px #1c1b18;3 |背景:线性渐变 ..
发布时间:2021-09-23 19:08:12 其他开发

如何在 CSS 模块中使用全局变量?

我正在忙着用 CSS 模块学习 React,但我不太明白如何存储变量?例如,在 Sass 中你可以这样做: //_variables.scss$primary-color: #f1f1f1;//标题.scss@import './变量';.heading {颜色:$primary-color} 你如何在 CSS Modules 中实现这一点? 解决方案 一种方法是使用依赖项.例如, ..
发布时间:2021-09-23 18:56:11 其他开发

CSS 模块:如何禁用文件的本地范围?

我在一个新的 React 项目中使用 CSS 模块(通过 Webpack css 加载器),尽管它运行良好,但我在获取 React Select 工作.我想这是因为它试图创建 local classNames,而 react-select 中的 JS 并不知道.有没有办法导入整个 .scss 文件,但在全局范围内而不是在本地范围内? 解决方案 我通常这样定义两个 CSS 加载器: //全 ..
发布时间:2021-09-23 18:54:44 其他开发

如何在 Nextjs 中散列 CSS 类名?

如何在 Nextjs 的 Webpack 配置中编辑 css-loader 的 localIdentName 字段,以便我可以散列/隐藏/混淆 css 类名? 下面的例子来自纽约时报.注意类名: 解决方案 不幸的是,Nextjs 中没有内置支持将自定义配置传递给 Webpack 加载器.但是我们可以通过使用 next.config.js 来解决它. 首先,在项目目录的根目录中创 ..
发布时间:2021-09-23 18:51:55 其他开发

在 Nextjs 中编辑 CSS-loader 的 localIdentName 以对用户隐藏类名

如何在 Nextjs 的 Webpack 配置中编辑 css-loader 的 localIdentName 字段,以便我可以散列/隐藏/混淆 css 类名? 下面的例子来自纽约时报.注意类名: 解决方案 不幸的是,Nextjs 中没有内置支持将自定义配置传递给 Webpack 加载器.但是我们可以通过使用 next.config.js 来解决它. 首先,在项目目录的根目录中创 ..
发布时间:2021-07-03 20:34:24 其他开发

选择器“:global .class"不纯(纯选择器必须至少包含一个本地类或 id)

我在 next.js 中使用带有 Sass 的 css 模块,但出现此错误 :global {.slick-track {显示:弹性;//语法错误:选择器“:global .slick-track"不纯(纯选择器必须至少包含一个本地类或 id)}} 这与官方的 css-modules 文档相同 example 但使用 Sass 而不是 Less 但在 Sass 语法中这应该可以工作. 我 ..
发布时间:2021-06-07 20:04:05 其他开发

如何使用 Antd/Less 和 Sass/CSS 模块配置 Next.js

我想将 Next.js 与 Sass 和 CSS 模块一起使用,但也想使用 Ant Design 并希望使用 Less 样式来实现更小的建筑尺寸. 我可以启用 CSS 模块或 Less 加载程序,但不能同时启用.Next.js 中的示例并没有帮助我解决这个问题. 解决方案 经过几个小时的研究,我现在终于找到了正确的解决方案,并想分享它: .babelrc(这里没有魔法) {“ ..
发布时间:2021-06-07 20:02:51 其他开发