SyntaxError: Unexpected identifier in TypeScript on import Web3 from “web3”

Question

I'm setting up a Node.js environment in Visual Studio Code to debug Truffle for Ethereum development. I open the truffle source folder in VSCode, then select truffle-migrate/index.js file, press F5 and after I fix a bunch of unresolved imports, I get an error as it's trying to resolve Web3 module from a TypeScript file.

c:\Users\dimitri\Zap.org\truffle\node_modules\truffle-interface- 
adapter\lib\web3-shim.ts:1
import Web3 from "web3";
       ^^^
SyntaxError: Unexpected identifier

I'm not sure if TypeScript is supported properly here. I tried changing

import Web3 from "web3";

to

import { Web3 } from "web3";

and

import web3 from "web3";

In folder truffle/node_modules/web3/dist there are 3 files:

web3.cjs.js
web3.esm.js
web3.umd.js

And each of them has a variation of:

var Web3 = function (_AbstractWeb3Module) {

and at the end of each file, there are:

module.exports = Web3;

export default Web3;

return Web3;

I assume these are 3 files for 3 different varieties of JavaScript. It looks like the Web3 module is being exported in them.

This is JavaScript importing TypeScript which imports JavaScript again. Am I having this issue because TypeScript is not properly set up in my environment (VSCode), or something else?

I want to set up Truffle to run inside VSCode, so I can step through it to find out what it does exactly. Truffle is a Node.js app. Am I even going about this the right way? If not, what do the developers of the Truffle Framework use and how do they set it up?

Answer 1

就我而言，我只是忘了安装依赖项npm i web3或npm i -S web3