[解決済み] Angular4へのアップグレード後、'require'という名前が見つからない
質問
AngularプロジェクトでChart.jsを使用したいです。 以前のAngular2バージョンでは、私は'chart.loader.ts'を使用してこれをうまくやっていました。
export const { Chart } = require('chart.js');
そして、コンポーネントコードでは、ただ
import { Chart } from './chart.loader';
しかし、cli 1.0.0とAngular 4にアップグレードした後、エラーが発生しました: "名前 'require'" を見つけることができません。
このエラーを再現するために
ng new newapp
cd newapp
npm install chart.js --save
echo "export const { Chart } = require('chart.js');" >> src/app/chart.loader.ts
ng serve
tsconfig.json」には、以下のような記述があります。
"typeRoots": [
"node_modules/@types"
],
そして'node_modules/@types/node/index.d.ts'にあります。
declare var require: NodeRequire;
だから混乱するんだ。
ちなみに、私は常に警告に遭遇します。
[tslint] The selector of the component "OverviewComponent" should have prefix "app"(component-selector)
.angular-cli.json'に "prefix": "" を設定していますが。angular-cli.json」から「.angular-cli.json」に変更したことが原因でしょうか?
どのように解決するのですか?
問題点(概略は typescript getting error TS2304: cannot find name ' require'. のように)、nodeの型定義がインストールされていないことです。
投影されたゲン担ぎで
with @angular/cli 1.x
というように、具体的な手順が必要です。
ステップ1 :
設置する
@types/node
を以下のどちらかでインストールします。
- npm install --save @types/node
- yarn add @types/node -D
ステップ2
:
あなたの
src/tsconfig.app.jsonを編集します。
ファイルを編集し、空の
"types": []
の代わりに以下を追加します。
...
"types": [ "node" ],
"typeRoots": [ "../node_modules/@types" ]
...
もし私が何か見逃していたら、コメントを書き込んでください。
関連
-
Angularが報告するインジェクションエラーとその解決方法...$injector:unpr]。
-
Node Sass は現在の環境のためのバインディングを見つけることができませんでした。Windows 64ビット、Node.js 8.x。
-
[解決済み] インデックスを属性値とするngFor
-
[解決済み] Angularのエラーです。"Can't bind to 'ngModel' because it isn't a known property of 'input'"."
-
[解決済み] Angular HTTP GET with TypeScript エラー http.get(...).map is not a function in [null].
-
[解決済み] '合成プロパティ @panelState を発見しました。BrowserAnimationsModule" か "NoopAnimationsModule" のどちらかを入れてください'。
-
[解決済み] ナンバーパイプ - Angular 2のパラメータは?
-
[解決済み] Angular 2 http.post()がリクエストを送信しない
-
[解決済み] ファイル 'app/hero.ts' is not a module error in console, where to store interfaces files in directory structure with angular2?
-
[解決済み] ページを離れる前に、未保存の変更点を警告する
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] TypeScript getting error TS2304: cannot find name ' require'.
-
[解決済み] NgModuleにおける宣言、プロバイダ、インポートの違いは何ですか?
-
[解決済み] Angular 2のキープレスごとの変更イベント
-
[解決済み] 予算内の警告、初期値で最大値を超える
-
[解決済み] SubjectとBehaviorSubjectの違いは何ですか?
-
[解決済み】Angularでアプリのバージョンを表示する方法は?
-
[解決済み] Angular 5 - クリップボードにコピーする
-
[解決済み] '合成プロパティ @panelState を発見しました。BrowserAnimationsModule" か "NoopAnimationsModule" のどちらかを入れてください'。
-
[解決済み] Angular 2+ - ベースのhrefを動的に設定する
-
[解決済み] Angular 2でシングルトンサービスを作成するには?