This is the seventh week of the project. My groupmates and I started to feel tired and not as full of energy as we were at the beginning of the project. I wonder if other Project workers have encountered the same situation? It seems that my team and I need a better way to balance work and rest to ensure enough motivation. This is also the seventh week of my term. While working on this project, I am conducting a course related to Computer Graphics. This is not an easy task for me.
Before this week’s project meeting, our team made a big step forward on the learning curve of Webpack and Ploty. But a few people are still a little unfamiliar with these technologies. I will try to help them reach the required level before the implementation of the project starts.
Core Concepts of Webpack
- Entry: Instruct Webpack which module should be used as the start of building its internal dependency graph. After entering the starting point, Webpack will find out which modules and libraries are dependent on the starting point (directly and indirectly).
- Output: Tell Webpack where to output the result files it creates, and how to name these files. The default value is ./dist.
- Loader (module converter): Convert all types of files into valid modules that Webpack can handle, and then you can use Webpack’s packaging capabilities to process them.
- Plugins: Inject extension logic at specific times in the Webpack build process to change the build result or do what you want.
- Module: The developer decomposes the program into discrete functional blocks, which are called modules.
Webpack Execution Process
After Webpack is started, the module configured in the entry will begin to recursively parse all the modules that the entry depends on. Whenever a module is found, it will find the corresponding conversion rules according to the configured loader. After the module is converted, the current module depends on the analysis. Module, these modules will be grouped by entry. An entry and all dependent modules are also a chunk. Finally, Webpack will convert all chunks into files for output. In the entire process, Webpack will execute the plugin logic at the right time.
