vue 分模块打包 脚手架

回答: 分模块打包是一种将不同模块的代码分别打包成独立的文件的方式。每个模块都有自己独立的入口文件和路由文件。在Vue项目中，可以通过在一个新的脚手架src目录下创建一个projects目录来实现分模块打包。在每个小项目中，可以创建assets、common、views等文件夹，并分别放置相应的资源文件和代码文件。同时，可以创建mApp.vue、main.js、router.js、store.js等文件来管理小项目的路由和状态。如果需要，还可以创建一个components文件夹来放置组件文件。这种方式可以方便地维护多个小项目，并实现它们的集成和独立运行。\[1\]

最近，我写了很多类似的小项目，每个项目都创建一个工程，这样维护起来有些不方便。因此，我决定将它们放在一个项目下进行分模块打包。以vue-cli3+为例，可以实现多系统集成下的分模块打包。这种方式适用于多个系统之间互不干扰的业务场景，主系统可以集成各个子系统，而各个子系统又可以单独运行。\[2\]

要实现分模块打包，首先需要创建一个projects目录。然后，可以按照需要在每个小项目中创建相应的文件夹和文件，如assets、common、views、mApp.vue、main.js、router.js、store.js等。如果需要，还可以创建一个components文件夹来放置组件文件。这样，每个小项目都有自己独立的代码和资源文件，可以进行独立的打包和运行。\[1\]

如果想要将css和js文件打包进单独的HTML文件，可以在分模块的文件中进行一些小的改动。具体的改动方式可以参考相关的文档或教程。\[3\]
#### 引用[.reference_title]
- *1* *2* [Vue大型项目之分模块运行/打包](https://blog.csdn.net/CSDN_bare/article/details/123051549)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
- *3* [vue 分模块打包，附css、js打包进HTML方法](https://blog.csdn.net/nxm2012/article/details/120491815)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]