Language-tools: postcss-preset-envカスタムメディアを使用する場合のsvelte（css-syntax-error）

＃305の複製

次にpostcssまたはcssの検証をサポートする予定はありません。 それはあまりにも多くのメンテナンス作業です。 セットアップ手順については、このドキュメントを参照し

特定のケースの場合：Svelteファイルはファイルごとにトランスパイルされるため、コンポーネント内で定義しないと、コンポーネント内の--tについては何もわかりません。 最終的にすべてが1つの大きなCSSにバンドルされるため、ビルドで機能すると思います。

ご回答ありがとうございます。 これにご尽力いただき、誠にありがとうございます。

これについて投稿することにしたのは、以前は2週間前からこれらのカスタムメディアクエリを使用していてエラーがなかったためですが、更新後（おそらく）、エラーが発生しました。 また、これは将来、css仕様の一部になる可能性があります。 少なくともその時は修正されることを願っています。 ありがとう

どういうわけか、media-queries.cssのカスタムメディアをsvelte-config.js前処理からも利用できるようにする必要があります。

あなたが投稿したこの正確なコードを試してみると、新しいエラーが発生します
「postcssPresetEnvは関数ではありません」。 .defaultを削除しても、まだ表示されます
エラー。 それでも、これを見てくれてありがとう。

9時37分で金、2020年9月4日には、LYU、魏・ダ[email protected]書きました：

あなたが抱えている問題は、svelte.config.jsのプリプロセッサのセットアップです。
ロールアップ構成に3つのプラグインがロードされています。 ただし、自動を有効にするだけです
svelte.config.jsでの前処理により、IDEのコンパイルプロセスが取得されないようにします
したがって、前処理されたスタイルはエラーをスローします。

svelte.config.jsでこれを試しましたが、エラーはなくなりました。

const sveltePreprocess = require（ 'svelte-preprocess'）const postcssImport = require（ 'postcss-import'）const postcssPresetEnv = require（ 'postcss-preset-env'）。defaultconst postcssNested = require（ 'postcss-nested'）
const postcssPlugins = [
postcssImport（）、
postcssPresetEnv（{ステージ：0}）、
postcssNested（）、]
module.exports = {
前処理：sveltePreprocess（{
sourceMap：true、
postcss：{
プラグイン：postcssPlugins、
}、
}）}

—
スレッドを作成したため、これを受け取っています。
このメールに直接返信し、GitHubで表示してください
https://github.com/sveltejs/language-tools/issues/517#issuecomment-686945578 、
または購読を解除する
https://github.com/notifications/unsubscribe-auth/AC6ONEK5L3PDUXKDVGIWFMLSECDKVANCNFSM4QTPHU5Q
。

申し訳ありませんが、XDが機能しないことがわかりました

私は回避策を見つけました（私が再び結論にあまりにも速くジャンプしなかったことを願っています笑）

// svelte.config.js
const sveltePreprocess = require('svelte-preprocess')
const fs = require('fs')
const mediaQueries = fs
  .readFileSync('./src/assets/css/media-queries.css')
  .toString()

module.exports = {
  preprocess: sveltePreprocess({
    postcss: {
      prependData: mediaQueries,
    },
  }),
}

ビルドについては、app.svelteでカスタムメディアを宣言しているためだと思います。 それを削除して開発サーバーを再起動すると、IDEで発生するのと同じエラーが表示されます。
たぶん、あなたはそれを使いたいときにメディアクエリをインポートするか、それをグローバルに利用可能にすることができます。

@ jasonlyu123あなたはただ素晴らしいです！ あなたは一度に両方の問題を解決しました（2つの場所でメディアクエリを持っていることも素晴らしいことではありませんでした）。 本当に感謝しています。今では楽しく仕事ができます。 もう一度ありがとう、そしてすべてに幸運を！