web-dev-qa-db-ja.com

tsconfigパスが機能しない

ドキュメントの jquery path example と非常によく似たことをしようとしていますが、TSはTS2307をスローし続けます（webpackは正常にコンパイルされます）。

"compilerOptions": {
    "baseUrl": "./src",
    "paths": {
        "@client": [
            "client",
        ],
        "@suir": [
            "../node_modules/semantic-ui-react/dist/commonjs", // not working
        ],
    },
    // …
},
"include": [
    "*.d.ts",
    "client/**/*",
    "../node_modules/semantic-ui-react", // is this necessary?
],

baseUrlを"."に変更し、includesとpathsを更新しても違いはありません（@clientは引き続き機能し、@suirは引き続き機能しません）。

"@suir"を"@suir/"または"@suir/*"に変更（およびその値に/*を追加）しても違いはありません。

これを行う理由は、インポートを単純化するためです（ベンダーバンドルサイズを削減するためにバンドルから名前付きエクスポートをプルする代わりに明示的に指定します。約1 MB節約されます）。

import Button from 'semantic-ui-react/dist/commonjs/elements/Button'; // works

import Button from '@suir/elements/Button'; // not found
typescriptaliastsconfigtypescript2.9
10
jacob

なぜこれが私が試みた11回目に取り組んでいるのか分かりません（まだ最初の10はしませんでした）が、/*は秘密のソースのようです。ドキュメントの例では、特定のファイルを指しているようです（ファイル拡張子は省略されています）。

{
    "compilerOptions": {
        "baseUrl": "./src",
        "moduleResolution": "node", // was not set before, but is the default
        "paths": {
            "@client/*": [
                "client/*",
            ],
            "@suir/*": [ // notice the `/*` at the end
                "../node_modules/semantic-ui-react/dist/commonjs/*", // notice the `/*`
            ],
        },
        // …
    },
    "include": [
        "./src/client/**/*",
    ],
}
10
jacob