Vue3.2 source reading notes — code debugging

Download the source code

Vue3 is being updated all the time, so there will be different versions, so how do we choose the version we want to read? GitHub provides tags, which lists code with different version numbers.

We’ll find v3.2.0 in the Tags list and download the Source code.

After downloading, unzip it and open it with vscode, and then execute NPM I in terminal to download the dependent data.

Building code

Change the dev property of package.json to the following, since it can produce the sourceMap file, with this code we can debug the code in the debugger.

"dev": "node scripts/dev.js --sourcemap"
Copy the code

After the modification, run the command on the terminal

npm run dev
Copy the code

Debugging example

The code we just packaged is stored in the Packages/Vue /dist directory. We then create our demo file in Packages/Vue /examples. An example is shown below

By opening this file in a browser, we can debug the code.