单页和多页之间的差异在这里不会说。我们的业务适用于多页面,许多小应用程序嵌入在iframe的整体嵌入式中。
SRC目录是我们通常开发的目录。
1将当前项目转换为多页面目录
在页面下为我们开发的目录文件是将原始SRC下的所有目录结构复制到家庭中。索引每个页面分开以提取多页面优势。
类似于家庭和索引中的主页,然后我们更改vue.config.js
现在我们打包并查看生成的目录结构
您可以看到包装混合在一起。下一步是将它们分开并配置命令以分别包装该想法。循环页面下的文件夹我们在页面下的目录中找到所有带有main.js的文件文件夹。当然,我们也可以手动写入死亡。每次增加页面时,我们都会分别维护此数组
当然,我们还可以帮助我们维护此数组,这可以在我们更新时节省更多麻烦
构建我们的数组和我们的数组
现在,我们继续转换vue.config.js。我们首先更改package.json中命令中的存在形式。根据我们通过的参数
我们如何获取索引或家庭参数,我们可以获得process.argv参数的结果。可以将其搜索process.argv作为数组。JavaScript文件路径的当前执行是其余参数,就像我们在该过程上传递的索引一样。ARGV[3]现在在vue.config中转换。JS如下如下
目前,我们NPM运行构建:索引尝试查看包装结果。您可以看到可以将所有与索引相对应的文件放在索引文件目录中。如果我们需要打包回家,则直接npm运行构建:家庭
现在我们已经实施了它并单独打包,但是如果我们认为,我们命令打包所有页面。这次我们需要一种节点方式来帮助我们意识到我们正在单独构建JS文件代码。
思想是循环包装命令的关键,是为我们执行包装命令的Execsync方法。现在我们执行它,npm运行_build
在这一点上,我们的多页包装基本上已经完成,将来可以完成一些CDN处理,或者优化块的拆卸。
我没有写太多文章,每个人都会阅读排版