web-dev-qa-db-ja.com

CSS /画像アセットにWebpackrequireを使用すると、Typescriptコンパイラが「モジュールが見つかりません」

私はVanilla Javascriptを書いていますが、TypeScriptコンパイラのcheckJsオプションを使用してVSCodeで型チェックを行っています。さまざまなアセットタイプ(CSS、イメージなど)をロードするようにWebpackを設定しましたが、ビルドでは正常に機能しますが、Codeはこれらのステートメントをエラーとして扱います。たとえば、このコードでは

_require("bootstrap");
require("bootstrap/dist/css/bootstrap.css");
var img = require("../img/image.png");
_

最初の行は問題ありませんが、次の2つは、require()の(string)引数の下に、ツールチップ「モジュール(名前)が見つかりません」というエラーが表示されます。

_@types/webpack_と_@types/webpack-env_をインストールしました。これにより、resolve()resolve.context()が修正されました。別のタイピングパッケージが不足していますか、それともこれを取り上げる必要がある問題ですか DT Issue Tracker

11
Coderer

JSまたはTS以外のリソースを必要とすることは、現在、VSCodeのJavaScriptおよびTypeScriptインテリセンスを強化するTypeScriptサーバーではサポートされていません。これを追跡する問題は次のとおりです: https://github.com/Microsoft/TypeScript/issues/15146

回避策として、プロジェクトに次の内容のd.tsファイルを作成してみてください。

declare module '*.css' { export default '' as string; }
declare module '*.png' { export default '' as string; }

Requireの前に// @ts-ignoreを追加することで、個々のエラーを抑制することもできます。

// @ts-ignore
var img = require("../img/image.png");
14
Matt Bierner