7

Webpack の ProvidePlugin 構成で実際に既に構成されている未解決の変数に対して typescript コンパイラが叫び始めた後に、WebPack のビルド プロセスが失敗するのを防ぐ方法はありますか?

webpack.config.js

plugins: [
...
new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery",
            "window.jQuery": "jquery",
            "_": "underscore",
            "underscore": "underscore"
            //'process.env.NODE_ENV': '"development"'
        }),

]

tsconfig.json

{
  "compilerOptions": {


    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "suppressImplicitAnyIndexErrors": true,
    "declaration": false
  },
  "exclude": [
    "node_modules",
    "typings/main",
    "typings/main.d.ts"
  ]
}

https://webpack.github.io/docs/list-of-plugins.html#provideplugin

私の経験から、typescript はどの変数がモジュールに挿入されるかを認識していないため、ビルドは完了しません。

これはビルドの出力です

ERROR in ./src/file1.component.ts
(77,9): error TS2304: Cannot find name '$'.

ERROR in ./src/file2.component.ts
(78,13): error TS2304: Cannot find name '$'.

ERROR in ./src/file3.ts
(155,15): error TS2304: Cannot find name 'jQuery'.

ERROR in ./src/file4.ts
(108,9): error TS2304: Cannot find name '$'.
4

3 に答える 3

1

ProvidePlugin を正しく理解している場合でも、jQuery とアンダースコアをモジュール (外部またはエイリアス) として宣言する必要があります。

したがって、これらのモジュールを TypeScript に次のようにロードすることをお勧めします。

import * as $ from 'jquery';
import * as _ from 'underscore';

次に、これらのライブラリの定義 (.d.ts) ファイルを提供するだけです。そのためにはタイピングをお勧めします。

typings install jquery --global
typings install underscore --global

それを自動的に処理するts-loaderを使用していると思います。

ステートメントを避けたい場合importでも、タイピングからの定義でそれらのライブラリを宣言できます。

または、独自の簡略化された宣言を作成できます。

declare var jQuery: any;
declare var $: any;
于 2016-06-23T17:07:01.397 に答える