Today, I am maintaining an old project of Vue. Due to the long history and outdated basic engineering configuration, the hot update of Vue is very slow.

solution

Based on terminal run printing and daily development experience guess: it should be Babel compilation;

To solve the effect

Effect first!!

Below, we will begin to solve from these two aspects:

The solution

Start with the Babel compilation

Install the plugin babel-plugin-dynamic-import-node to solve the problem of slow compilation due to large projects and large contents.

Import () from existing projects to a Deferred require(),

This delays the introduction of import() in the project during compilation.

    npm install babel-plugin-dynamic-import-node --save-dev
Copy the code

Don’t be afraid of problems

    npm install babel-plugin-dynamic-import-node --save-dev --legacy-peer-deps
Copy the code

Set. Babelrc

"development": {
      "plugins": [
        "dynamic-import-node"]}Copy the code

At this point, our project went from a 2 minute compile time to about 1S

How fragrant!!

This is the content to share with you, thank you for reading, remember to like 👍!

A little bit more every day. I’m Asscre. Please follow me!