Below is my own sort of vue of the overall structure,
We can see it as a whole is divided into three parts: the core code, cross-platform tools and utility-related functions. At the same time, which is a layered architecture, the lowest level is a normal constructor, the uppermost layer is an inlet,
Which is a complete constructor exported to users, and in the topmost intermediate bottom, to add some methods and properties, and some of the ways one constructor will eventually added to the prototype property constructor,
Method to the next level will eventually be added to the constructor, these methods are called global API, that is to say, now add a method to the prototype property after the constructor, the constructor itself again add global API, go down to the floor Yes
And relevant content across platforms when building, first choose a platform, then the code for this particular platform is loaded into the build file, then a layer consists of two parts: the server and render relevant content related to the compiler content,
You will be selected according to the target file needs to be built when the building came compiler load
There is a dist directory vue directory structure, under which there are many different Vue.js builds
If the building contains only the runtime version of the code, it will not render layer part of the compiler code is loaded out .
When the build file, different platforms build file constructed selecting different entry operation.
In fact, the whole program structure can also be used to show another form of expression, as the following three core code code is platform-independent, the top three are associated with the platform code.
The figure is another form of expression, looks at a glance
Different platforms have different entrance, there are platform specific code is loaded into this section, and the bottom layer of the core code is generic, may be operated at any internet.
Here to build a Web file to run under the platform, for example, if we are to build the full version, you can select the Web platform to start building entrance file, this final entry file
Vue a constructor exported before exporting, to add some Vue constructor method, which processes are: Xianxiang prototype property Vue constructor add methods,
Then add to the Vue constructor itself some global API, then the platform-specific code import in, finally compiler import in, eventually will go to export all code with Vue constructor.
to sum up:
在架构设计中，Vue大体可以分为：核心代码、跨平台相关与公用工具函数，核心代码包含原型方法和全局API，可以在各个平台运行，而跨平台相关的部分更多
的是渲染相关的功能，不同平台下的渲染API是不同的，以Web平台为例，Web页面中的渲染操作就是操作DOM，所以在跨平台的Web环境下对DOM操作的API
进行了封装，这个封装主要与虚拟DOM对接，而虚拟DOM中所使用的各种节点操作其实是调用跨平台层封装的API接口，而Weex平台对节点的操作与Web平台并不相同。
文字过于多。一定要有耐心，仔细阅读哟。