別のパッケージから1つのパッケージの入力を増やすことはできますか？

Question

マイアプリはChart.jsを強化Chart.PieceLabel.js、使用している：私はDefinitelyTypedからChart.jsのためのタイプをインストールしてい

npm install chart.js chart.piecelabel.js 

を：

npm install @types/chart.js 

私はタイピングに貢献したいと思いますChart.PieceLabel.jsレポが表示されますが、私のアプリには認識させることができません（Chart.jsの入力を登録しますが、npm linkまたはnode_modules/chart.piecelabel.jsで直接タイプを編集すると、私の増強を見てください。

私はこのように私のアプリでChart.jsとChart.PieceLabel.jsを使用します。

import { Chart } from 'chart.js' 
import 'chart.piecelabel.js' 
import { Doughnut } from 'react-chartjs-2' 

let chart = <Doughnut options={{..}} /> 

私のタイピングは、このコミットである：https://github.com/bcherny/Chart.PieceLabel.js/commit/9e6744c。

私のアプリケーションコードはhttps://git.io/vF23gです。

ここでは分離再生のケースがhttps://stackblitz.com/edit/zbj4nf?file=index.tsであり、問​​題なく動作します。

私のtsconfig.jsonは誤って構成されていますか？

ありがとうございます！

Answer 1

拡張を有効にするには、拡張を定義するモジュールをコンパイルに含める必要があります。

あなたは@typesに別々のパッケージとしてChart.PieceLabel.d.tsを配布した場合、自動的に含まれていたであろう：デフォルトでは

@types, typeRoots and types

すべての可視「@types」のパッケージはあなたの コンパイルに含まれています。 node_modules/@囲みフォルダ内のパッケージ は可視と見なされます。具体的には、 ./node_modules/@types/、../node_modules/@types/、 ../../node_modules/@types/などのパッケージを意味します。

node_modulesのメインのjavascriptパッケージに含まれている場合は、明示的にどこかで参照する必要があります。 .d.tsをfilesセクションに明示的に含めてtsconfig.jsonに含めることができます。または、importをインポートするだけで、 "import for side-effects only"とすることができます。私はすべての必要なタイピング

npm i chart.js chart.piecelabel.js @types/chart.js react-chartjs-2 @types/react 

をインストールしようとした

はnode_modules/chart.piecelabel.jsパッケージ

に変更を適用し、typescriptです2でこれを試してみました。6 - それがコンパイルされます。

import 'chart.piecelabel.js' 

import * as Chart from 'chart.js'; 

import * as React from 'react'; 
import { Doughnut } from 'react-chartjs-2' 

let o: Chart.ChartOptions = { 
    responsive: true, 
    pieceLabel: { 
     render: 'label' 
    } 
}; 


let d = React.createElement(Doughnut, { 
    options: { 
     responsive: true, 
     pieceLabel: { 
      render: 'label' 
     } 
    }, 
    data: undefined as any // just to make it compile 
}); 

UPDATEここ

は私の手順は次のとおりです。

git clone https://github.com/bayesimpact/tds-frontend.git 
cd tds-frontend 
git checkout personal/bcherny/publish-types 
npm i 
./node_modules/.bin/tsc -v 

それが言う "バージョン2.6.1"

./node_modules/.bin/tsc 

それは多くを吐き出します

から始まるエラーの件数 01私は tsconfig.jsonから "strict": trueを削除

src/components/LeftPane/Drawers/ServiceAreasDrawer/ 
     ServiceAreasDrawer.tsx(64,10): error TS2684: The this context of type 
'LoDashExplicitWrapper<[string, string][]>' is not assignable to method's 'this' of type 'LoDashExplicitWrapper<ArrayLike<[string, string]> | Dictionary<[string, string]> | NumericDiction...'. 
     Types of property 'push' are incompatible. 
      Type '<T>(this: _.LoDashExplicitWrapper<ArrayLike<T> | null | undefined>, ...items: T[]) => _.LoDashExp...' is not assignable to type '<T>(this: _.LoDashExplicitWrapper<ArrayLike<T> | null | undefined>, ...items: T[]) => _.LoDashExp...'. Two different types with this name exist, but they are unrelated. 
       Type 'LoDashExplicitWrapper<[string, string][]>' is not assignable to type 'LoDashExplicitWrapper<ArrayLike<[string, string]> | Dictionary<[string, string]> | NumericDiction...'. 
src/components/LeftPane/Drawers/ServiceAreasDrawer/ 
    ServiceAreasDrawer.tsx(65,10): error TS7006: Parameter '_' implicitly has an 'any' type. 

、唯一残っているエラーは、次のとおりです。

src/services/api.ts(12,11): error TS2345: Argument of type '{ body: string; headers: { Accept: string; 'Content-Type': string; }; method: "GET" | "POST"; }' is not assignable to parameter of type 'RequestInit'. 
    Types of property 'headers' are incompatible. 
    Type '{ Accept: string; 'Content-Type': string; }' is not assignable to type 'Headers | string[][]'. 
     Object literal may only specify known properties, and 'Accept' does not exist in type 'Headers | string[][]'. 
src/services/effects.ts(80,17): error TS2339: Property 'distance_to_closest_provider' does not exist on type '{}'. 
src/services/effects.ts(81,17): error TS2339: Property 'time_to_closest_provider' does not exist on type '{}'. 
src/services/effects.ts(85,19): error TS2339: Property 'id' does not exist on type '{}'. 
src/services/effects.ts(86,42): error TS2339: Property 'distance_to_closest_provider' does not exist on type '{}'. 
src/services/effects.ts(87,38): error TS2339: Property 'time_to_closest_provider' does not exist on type '{}'. 
src/services/effects.ts(88,42): error TS2339: Property 'closest_provider_by_distance' does not exist on type '{}'. 
src/services/effects.ts(89,38): error TS2339: Property 'closest_provider_by_time' does not exist on type '{}'. 

私は最初のものはknown recent bug in DOM typingsによるものであると考えて、私は他の人については考えているが、私はしないでくださいドーナツオプションのpieceLabelに関連するエラーを参照してください。

UPDATE 2

私はtypescriptですの異なるバージョンを試してみました：

npm i typescript@2.5 
./node_modules/.bin/webpack 

エラーが

しかしWebPACKのは、言った：

Failed to load ./.env. 

だから、多分あなたが何かを持っていないかもしれませんこれに影響するファイル

また、私はtypescript 2.4を試しました。エラーもありません。