笑话和SCSS变量 [英] Jest and SCSS variables

问题描述

我在项目中使用的是Jest，并且卡在了一个包含SCSS变量的测试中.

I'm using Jest in my project and got stuck on one test which contains SCSS variable.

$grey-light: #C7C7C7;

我得到这个开玩笑的错误:

I get this Jest error:

Jest遇到意外令牌

Jest encountered an unexpected token

，它指向前面提到的代码行.

and it points on the previous mentioned line of code.

推荐答案

我也遇到了这个问题，并且使用identity-obj-proxy包解决了该问题:

I ran into this as well and it was solved by using the identity-obj-proxy package:

https://github.com/keyz/identity-obj-proxy

只需按照Jest文档中的说明进行操作:

Just follow the instructions in the Jest docs:

https://jestjs.io/docs/en/webpack#mocking- css-modules

并且应该运行有关.scss文件导入语句的问题的测试.您所要做的就是在package.json文件中包括简单的配置:

And should run the tests with no issues regarding the .scss files import statements. All you have to do is include the jest configuration in your package.json file:

{
  "name": "...",
  "version": "0.0.0",
  "description": "...",
  "main": "index.js",
  "scripts": {
    "start": "webpack --config webpack.config.js",
    "test": "jest"
  },
  "jest": {
    "moduleNameMapper": {
      "\\.(css|scss|less)$": "identity-obj-proxy"
    }
  },
  "keywords": [],
  "author": "Homer Jay",
  "license": "MIT",
  "devDependencies": {},
  "dependencies": {}
}

.scss导入将按预期工作，并且任何变量或mixin都不会引发错误.

And the .scss imports will work as expected and any variable or mixin won't throw an error.

这篇关于笑话和SCSS变量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！