first question:

exclude : /node_modules\/(?!(dom7|ssr-window|swiper)\/).*/

means that the three rules are not followed by dom7 | ssr-window | swiper , that is, if you import , all three will be processed by babel , because all three syntax supports esm .
second question:

exclude: /node_modules\/(?!(dom7|ssr-window|swiper)\/).*/,
include: [resolve('src'), resolve('test'),resolve('node_modules/webpack-dev-server/client')]

you don't have include (dom7 | ssr-window | swiper) in this way, so naturally you don't deal with babel , but exclude is mainly used for elimination.

third question:

include: [resolve('src'), resolve('test'),resolve('node_modules/webpack-dev-server/client'),resolve('node_modules')]

you put all the node_modules include in, so some modules may not have esm syntax, such as babel-runtime , lodash , etc., which may cause errors or warnings.