Writing in the front

In fact, the beginning is not specifically to study vue-CLI source code, just want to understand the command of node, if you want to understand the command of node, then can not bypass tJ write commander. Js. In the process of learning Commander. Js, I found that vue-CLI interaction is quite cool, and then I read the source code, so THIS article came into being.

link

Vue-cli 3.0 source code analysis

directory

@vue/cli

  • preface
    • introduce
  • start
    • Environment introduction
    • Common NPM package
  • vue create
    • The create entry
    • The overall analysis
    • Basic authentication
    • Get preset option (Preset)
    • Dependent Installation
    • Generator
    • At the end of analysis
    • conclusion
  • vue add
    • Add the entry
    • Installing a plug-in
    • Call the plugin
    • conclusion
  • vue invoke
    • Invoke the command
  • vue inspect
    • Inspect the command
  • vue serve
    • Serve the command
  • vue build
    • The build command
  • vue ui
    • The UI entrance
    • The overall analysis
    • The server side
    • The client side
    • conclusion
  • vue init
    • Init entrance
    • @ vue/cli – init analysis
    • Vue-cli 2.x init Analysis
    • Analysis of generate function
    • conclusion
  • vue config
    • The config command
  • vue upgrade
    • The upgrade command
  • vue info
    • The info command

@vue/cli-service

  • Overall introduction
    • The entrance
    • new Service()
    • service.run()
  • Built-in plug-ins
    • serve
    • build
    • inspect
    • help

conclusion

Vue-cli-analysis The whole project can be roughly divided into two parts, one is vue command analysis, including Create, Add, Invoke, UI, etc., and the other is vue-cli-service analysis. Analysis shows that 3.0 is a big change from 2.x, and the introduction of a plug-in system allows developers to extend projects with its exposed apis. Before the analysis, I didn’t know much about the plug-in mechanism and how to implement it. After the analysis, I gradually understood its implementation mechanism and became more familiar with the configuration of THE VUE project. In addition, there are many interesting NPM packages learned during the analysis process, such as execa, Debug, lowDB, Lodash, Inquirer, etc. Finally, if you want to learn node commands or want to write some interesting command line tools, Reading vue-CLI source code is a good choice.