GitHub Project address:Modules
Modular development has become one of the following trends. It has never been used before. Recently, I have learned from a video. I mainly use webpack. Of course, the principle of webpack is not very clear. I have read the documents before and am confused. Still unable to learn. It is barely usable now. With the mainstream development of the front-end, node NPM webpack vue react angular cannot be fewer than one. However, I am helpless and weak, and now I will only be a vue, you can use the fur to record it.
The main project directory is configured by using webpack. The principle is not very clear. During the writing process, various dependency packages are installed through npm I, and node webpack is integrated for output, like the webpack above. dev. config. JS (Development Environment)/webpack. prod. config. JS (production environment) for output, define the portal file export file configuration rules (loader XXX-loader. personal Understanding ). Then, get used to import from, export default/export XXX, and run the compilation output through the command line.
Const Path = require ("path"); // node native apiconst htmlwebpackplugin = require ('html-webpack-plugin'); module. exports = {// entry: {// you can have multiple entries or one entry. If one entry is exports, 'main. js ':'. /src/main. js' // entry file in my project}, // export output: {path: path. resolve ('. /Dist '), // API filename of the relative path to the absolute path node: 'build. js' // single quotes can be changed at will without single quotes.}. // The Declaration module contains various loaders. loader module: {loaders: [// a later version of webpack is called rules {test :/\. xxx $/, loader: 'xxx-loader '}, // loading rule. There will be multiple loaders]}, plugins: [// The execution sequence of the plug-in is related to the index of the element. New htmlwebpackplugin ({template :". /src/index.html ", // reference object})],}
I have time to look at the principles of webpack later, so I will introduce my first introduction to modularity. Bytheway, these things cannot help everyone, because better websites are everywhere, permission is the note you have made for yourself. Even if it is lost one day, you can still find it here to let yourself have a deposit. Fuel Learning
Record modular Development