質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Q&A

解決済

2回答

21979閲覧

jsファイルにimport文を書いたら「モジュールの宣言ファイルが見つかりませんでした」と叱られた。

hokosugi

総合スコア63

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

0グッド

2クリップ

投稿2019/06/26 11:19

簡単なDappsを作成しています。フロントサイドにreactを使っていますが、import文で詰まっています。
エラー文は以下の通りでimport truffleContract from 'truffle-contract'
「モジュールの宣言ファイルが見つかりません /path/truffle-contract/index.js は暗黙的に'any'型になります」
と注意が出ます。そのためtruffle-contractが読み込めずdeployedメソッドが効かないのだと思われます。

TypeError: truffle_contract__WEBPACK_IMPORTED_MODULE_4___default.a.deployed is not a function at App.componentDidMount (App.js:30)

react

1import React from 'react'; 2import './App.css'; 3import MarriageCertification from './contracts/MarriageCertification.json'; 4import getweb3 from './getWeb3'; 5import truffleContract from 'truffle-contract'; 6 7class App extends React.Component { 8 constructor(props) { 9 super(props); 10 this.state = { 11 web3: null, 12 accounts: null, 13 contract: null, 14 list: [], 15 husbandName: "", 16 husbandAge: "", 17 wifeName: "", 18 wifeAge: "", 19 swearWord: "", 20 } 21 this.handleChange = this.handleChange.bind(this); 22 } 23 24 componentDidMount = async() => { 25 try { 26 const web3 = await getweb3(); 27 const accounts = await web3.eth.getAccounts(); 28 const contract = truffleContract(MarriageCertification); 29 contract.setProvider(web3.currentProvider); 30 const instance = await truffleContract.deployed(); 31 32 this.setState({ 33 web3, accounts, contract: instance 34 }); 35 console.log(this.state.accounts); 36 console.log(this.state.web3); 37 console.log(this.state.contract); 38 } catch (e) { 39 console.log(e); 40 } 41 } 42 //以下省略

###やってみたこと
require文に変えてみる
const truffleContract = require('truffle-contract');
require文に「モジュールの宣言ファイルが見つかりません」が出るようになった。

truffle-contractのアンインストール、再度インストール
npm uninstall truffle-contract --save
npm install truffle-contract
変わらず「モジュールの宣言ファイルが見つかりません」が出続ける。

truffle-contract/index.jsにexportする文が書かれていないのか?とも考えましたが、
module.exports = contract;
とちゃんと書かれていました。

「モジュールの宣言ファイルが見つかりません」で検索しても検索数が少なく、解決策が見つからず困っています。
手がかりになることがありましたらお知恵を拝借させてください。
よろしくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

ベストアンサー

すいません。TSではなくJSの話でしたね。
削除はできないようなので、とりあえず斜線を入れておきます

確証が持てなくて申し訳ないですが、「モジュールの宣言ファイルが見つかりませんでした」はTypeScriptの型定義ファイルが見つからなかったときに出るエラーな気がします。(日本語でこのメッセージを見たことがないのでわからないですが)

TS.configの設定でnoImplicitAnyをfalseにしてしまえば、とりあえずany型で取り込むことはできると思うので、それで使えないでしょうか?

それか一応、誰かが作った型定義ファイルは以下に落ちてるみたいなので、これを使ってみても良いかもしれません。
https://www.npmjs.com/package/@machinomy/types-truffle-contract

投稿2019/06/26 15:27

編集2019/06/26 17:27
KuwabataK

総合スコア306

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

hokosugi

2019/06/26 21:16

ご回答ありがとうございます。 まだまだ初心者でTSとJSの区別もついていません。ご意見を伺いエラー表示に"TS(7016)"があることに気付き検索するとVSCodeの問題だとするページを見つけたのでatomで開き直して保存したらエラーなくreactが動いてくれました。 https://stackoverflow.com/questions/51069070/removing-ts-errors-from-js-files-in-vs-code その後VSCodeに戻っても「モジュールの宣言ファイルが見つかりません」、"TS(7016)"は消えはせず、それでいてエラーにならないのは私の理解を超越していてどうにもなりません。しかし解決したので良しとします。ご協力ありがとうございました。
guest

0

exportされたものと違う名前のものをimportしようとしているだけでは?
これ見る限りだと

javascript

1import contract from 'truffle-contract'

でcontractをimportして使うっぽいように見えるんですが。

投稿2019/06/26 12:26

gentaro

総合スコア8949

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

hokosugi

2019/06/26 12:46

ご回答ありがとうございます。 試しに変数名を'contract'に変更してみましたが変化なく、「モジュールの宣言ファイルが見つかりません」となります。リンクしていただいたドキュメントを再度熟読してみてヒントを得たいと思います。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問