JS, CSS resource loader, how to manage

Question

Due to historical issues, the company has not used resource loaders. It’s all about using whatever you want. Various references to the page. I used SeaJS before, but it felt like there were a lot of pitfalls. The official website is now gone. o(╯□╰)o.
Which is the mainstream solution now?
Traditional page development requires CSS management.

Answer 1

1.grunt
matched with
grunt-rev
grunt-usemin
2.gulp
matched with
gulp-rev
gulp-useref

Answer 2

There are two types of modularization, one is implemented on the client (browser), and the other is implemented by server-side preprocessing.

The essence of JS modularity is that each module is relatively independent and does not pollute the overall situation, and can also ensure dependencies.
The implementation on the client is requireJS or seaJS. I think there are only some differences in syntax between the two, but the principles are the same.
The implementation of preprocessing can be webpack or browserify.

CSS is now basically preprocessed to achieve modularity, implemented through various preprocessors, such as sass and less. . .

Of course webpack is powerful enough to package everything together.

Of course, if the requirements are not very high, you can use gulp+gulp-useref to achieve simple and crude packaging. It combines multiple files into one and writes the path of the synthesized thing into the page. There is no modularization of JS.