본문 바로가기

개발하자

vitest Svelte App with Typescript : ParseError... 예기치 않은 토큰 '' : ''

반응형

vitest Svelte App with Typescript : ParseError... 예기치 않은 토큰 '' : ''

지원되는 응용 프로그램에서 몇 가지 단위 테스트를 설정하려고 하면 다음 오류가 발생합니다:

ParseError: D:/(...)/src/Overlay.svelte:23:17 Unexpected token

이 파일의 내용은 다음과 같습니다:

<!-- Overlay.svelte -->
<script lang="ts">   // line 1
    //  (...)
    let startDate:string = tomorrows_date();  // line 23
//               ^--23:17

나는 의 구조를 재현하려고 노력해왔다.

나는 모든 곳을 조금 찾아보면서 a를 사용하거나 추가하려고 했다. (이것은 "모듈 밖"이라는 문구 때문에 작동하지 않는다.)

내 구성 아래에서 찾아보세요.

나는 이 모든 것을 내 안에 추가했다:

// package.json
   (...)
  "scripts": {
    "build": "rollup -c",
    "dev": "rollup -c -w",
    "start": "sirv public --no-clear -c",
    "validate": "svelte-check",
    "check": "svelte-check --tsconfig ./tsconfig.json",
    "test": "vitest",
    "test:ui": "vitest --ui",
    "coverage": "vitest run --coverage"
  },
  "devDependencies": {
    "@rollup/plugin-commonjs": "^21.0.1",
    "@rollup/plugin-json": "^4.1.0",
    "@rollup/plugin-node-resolve": "^13.1.3",
    "@rollup/plugin-typescript": "^8.0.0",
     (...)
    "@sveltejs/vite-plugin-svelte": "^1.0.0-next.45",
    "@testing-library/svelte": "^3.1.3",
    "@tsconfig/svelte": "^2.0.0",
    "@vitest/ui": "latest",
    "jsdom": "latest",
    "rollup": "^2.67.0",
    "rollup-plugin-css-only": "^3.1.0",
    "rollup-plugin-livereload": "^2.0.5",
    "rollup-plugin-svelte": "^7.1.0",
    "rollup-plugin-terser": "^7.0.2",
    "svelte": "^3.49.0",
    "svelte-check": "^2.0.0",
    "svelte-preprocess": "^4.0.0",
    "tslib": "^2.0.0",
    "typescript": "^4.0.0",
    "vitest": "^0.18.1",
    "vitest-svelte-kit": "^0.0.6"
  },
  "dependencies": {
    "sirv-cli": "^2.0.2",
    "svelte-material-ui": "^6.0.0-beta.16"
  },
  "stackblitz": {
    "startCommand": "npm run test:ui"
  }
}
// tsconfig.json
{
  "extends": "@tsconfig/svelte/tsconfig.json",

  "include": ["src/**/*"],
  "exclude": ["node_modules/*", "__sapper__/*", "public/*"]
}
// vitest.config.js
import { defineConfig } from 'vite'
import { svelte } from '@sveltejs/vite-plugin-svelte'

export default defineConfig({
    plugins: [
        svelte({ hot: !process.env.VITEST }),
    ],
    test: {
        globals: true,
        environment: 'jsdom',
    },
})

나는 없다




TS는 테스트 구성이 암묵적으로 로드하지 않는 것을 요구합니다. 다음을 통해 구성할 수 있습니다:

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

module.exports = {
  preprocess: sveltePreprocess({ ... })
};



가장 유리한 구성에서 다음 구성을 사용합니다:

enter image description here


반응형