在 VS Code 中使用 CoffeeScript/Pug 正确处理 Svelte 文件

编程问答 2022-05-28

问题描述

我修改了 svelte 入门模板，因此可以通过 svelte-preprocess 使用 CoffeeScript。 VS Code 显示 svelte 文件的“问题”，因为 CoffeeScript 被解释为 JavaScript：

enter image description here

请注意，这只是 VS Code 工具的问题；项目构建完成后，CoffeeScript 会被正确检测并编译成 JavaScript。

为什么 VS Code 将 CoffeeScript 作为 JavaScript 处理？ 我尝试为 svelte + CoffeeScript 配置 VS Code 的步骤：

  1. 安装 Svelte for VS Code 扩展。

  2. 在项目根目录中添加 svelte.config.js 文件，每个 these instructions：

如果一个 svelte 文件包含除 html、css 或 javascript，svelte-vscode 需要知道如何对其进行预处理。这个可以 通过创建 svelte.config.js 文件来实现...

  1. 重启语言服务器。

起初我尝试了上面说明中的简单 svelte.config.js。然后我修改了它以确保 Svelte language tools and rollup use the exact same configuration:

// svelte.config.js   
const sveltePreprocess = require('svelte-preprocess');

function createPreprocessors() {
  return sveltePreprocess({
    defaults: {
      markup: 'pug',script: 'coffeescript',style: 'css'
    },coffeescript: {
      bare: true
    }
  })
}

module.exports = {
  preprocess: createPreprocessors(),createPreprocessors
};

我还确认 VS Code 可以正确处理扩展名为 .coffee 的纯 CoffeeScript 文件。

整个项目位于：github.com/Leftium/svelte-coffeescript-pug

解决方法

您在使用 <script lang="coffee"> 时是否也遇到此问题？

coffeescriptsveltevisual-studio-code