Блог

Главная - Вопросы по программированию - Ошибка синтаксического анализа: Ожидается двоеточие (стройный в стиле scss) стройное модульное тестирование

Ошибка синтаксического анализа: Ожидается двоеточие (стройный в стиле scss) стройное модульное тестирование

#svelte

Вопрос:

Я пытаюсь написать тест для компонента, который использует SCSS в качестве стиля по умолчанию. Но тест выдает ошибку, из-за которой он не может понять SCSS

миКомпонент.стройная

 <div>Hello <span>world</span></div>
<style>
div {
 padding: 20px;
 span {
  font-weight: bold;
 }
}
</style>

Тестовый файл

 // mycomponent.test.js
import { render } from '@testing-library/svelte';
import MyComponent from './MyComponent.svelte';
...
const { component } = render(MyComponent, {});
...

Jest Config

 module.exports = {
  transform: {
    '^. \.js

Я устанавливаю стиль по умолчанию  SCSS  в конфигурации svelte

svelte.config.js


 const preprocess = require('svelte-preprocess');

module.exports = {
  preprocess: preprocess({ defaults: { style: 'scss' } }),
};
 


Стек ошибок


 Colon is expected
4:     padding: 20px;
5: 
6:     span {
              ^
7:       font-weight: bold;
8:     }
ParseError: Colon is expected

      at error (node_modules/svelte/src/compiler/utils/error.ts:25:16)
      at Parser$1.error (node_modules/svelte/src/compiler/parse/index.ts:101:3)
      at Object.read_style [as read] (node_modules/svelte/src/compiler/parse/read/style.ts:31:11)
      at tag (node_modules/svelte/src/compiler/parse/state/tag.ts:189:27)
      at new Parser$1 (node_modules/svelte/src/compiler/parse/index.ts:53:12)
      at parse (node_modules/svelte/src/compiler/parse/index.ts:218:17)
      at Object.compile (node_modules/svelte/src/compiler/compile/index.ts:93:14)
      at compiler (node_modules/svelte-jester/dist/transformer.cjs:135:32)
      at Object.processSync [as process] (node_modules/svelte-jester/dist/transformer.cjs:111:12)
      at ScriptTransformer.transformSource (node_modules/@jest/transform/build/ScriptTransformer.js:464:35)
 


Чтобы воспроизвести клонирование и запустить это репо 

https://github.com/rparsh/svelte-testing-scss

Комментарии:

1. Находится svelte.config.js ли файл в корневом каталоге вашего проекта?

2. да, он расположен в корне, где находится конфигурация jest @Phil

3. Глядя на документы предварительной подготовки svelte , я на самом деле не вижу defaults возможности. Вы уверены, что ваш конфигурационный файл правильный?

4. @Phil да поддерживается, я могу скомпилировать сборку. Похоже, они удалили его из документов несколько месяцев назад github.com/sveltejs/svelte-preprocess/commit/...

Ответ №1:

Добавить lang="scss" в <style> тег:

 <style lang="scss">
</style>

В общем, больше не рекомендуется использовать языки по умолчанию из-за подобных проблем. Вы не можете быть уверены, что все инструменты в экосистеме поддерживают чтение значений по умолчанию. Именно поэтому этот параметр был удален из документов и svelte-preprocess теперь выводит предупреждение о том, что вы больше не должны его использовать.

: 'babel-jest',
'^. \.svelteЯ устанавливаю стиль по умолчанию SCSS в конфигурации svelte

svelte.config.js



Стек ошибок




Чтобы воспроизвести клонирование и запустить это репо 

https://github.com/rparsh/svelte-testing-scss


Комментарии:


1.  Находится    svelte.config.js    ли файл в корневом каталоге вашего проекта?  


2.  да, он расположен в корне, где находится конфигурация jest @Phil  


3.  Глядя на     документы предварительной подготовки svelte    , я на самом деле не вижу    defaults    возможности.   Вы уверены, что ваш конфигурационный файл правильный?  


4.  @Phil да поддерживается, я могу скомпилировать сборку.   Похоже, они удалили его из документов несколько месяцев назад     github.com/sveltejs/svelte-preprocess/commit/...    


Ответ №1:




Добавить  lang="scss"  в  <style>  тег:




В общем, больше не рекомендуется использовать языки по умолчанию из-за подобных проблем. Вы не можете быть уверены, что все инструменты в экосистеме поддерживают чтение значений по умолчанию. Именно поэтому этот параметр был удален из документов и  svelte-preprocess  теперь выводит предупреждение о том, что вы больше не должны его использовать.




: ['svelte-jester', { preprocess: true, debug: true }],

  },

  moduleFileExtensions: ['js', 'svelte'],

  roots: ['<rootDir>/app/modules'],

  modulePaths: ['<rootDir>/app/modules'],

  moduleDirectories: ['node_modules', 'app/modules'],

  setupFilesAfterEnv: [

    '<rootDir>/app/modules/tests/setupTest.js',

    '@testing-library/jest-dom/extend-expect',

  ],

  clearMocks: true, // Automatically clear mock calls and instances before every test.

};

  


Я устанавливаю стиль по умолчанию  SCSS  в конфигурации svelte


svelte.config.js




Стек ошибок




Чтобы воспроизвести клонирование и запустить это репо 

https://github.com/rparsh/svelte-testing-scss


Комментарии:




1.  Находится    svelte.config.js    ли файл в корневом каталоге вашего проекта?  


2.  да, он расположен в корне, где находится конфигурация jest @Phil  


3.  Глядя на     документы предварительной подготовки svelte    , я на самом деле не вижу    defaults    возможности.   Вы уверены, что ваш конфигурационный файл правильный?  


4.  @Phil да поддерживается, я могу скомпилировать сборку.   Похоже, они удалили его из документов несколько месяцев назад     github.com/sveltejs/svelte-preprocess/commit/…    



Ответ №1:




Добавить  lang="scss"  в  <style>  тег:




В общем, больше не рекомендуется использовать языки по умолчанию из-за подобных проблем. Вы не можете быть уверены, что все инструменты в экосистеме поддерживают чтение значений по умолчанию. Именно поэтому этот параметр был удален из документов и  svelte-preprocess  теперь выводит предупреждение о том, что вы больше не должны его использовать.










	Метки: