安装

npm i multiple_single_page_apps

运行

// 运行aViews
npm run dev:aViews

// 运行bViews
npm run dev:bViews

webpack版本

webpack: 5.70.0 webpack-cli: 4.9.2 webpack-dev-server 4.7.4 全局安装即可

引入并解析scss

module.exports = {
    css: {
        loaderOptions: {
            sass: {
                // 适合放全局css变量,mixins变量，因为它不是真实的css，注意双引号外的分号，一定要有
                prependData: `@import "@/assets/variable.scss";`
            }
        }
    }
}

分端配置devServer

如果各个项目中的配置完全不一样，可以像项目中那样配置，如果一致，可以直接在vue.config中统一配置

分端打包

项目配置入口文件需要是本身包内的main.js；否则包还是和一起打包； 要求包内独立的router和main.js 其中使用了[gzip压缩],[TerserPlugin]代码压缩，其中[gzip压缩]，需要服务器启用gzip nginx配置开启压缩

npm publish

遇到的问题： 发布第一卡

npm ERR! code E426
npm ERR! 426 Upgrade Required - PUT http://registry.npmjs.org/multiple_single_pages

//解决方案：升级node版本，推荐使用nvm管理node，可以根据项目需求切换node版本

发布第二卡

npm ERR! code E404
npm ERR! 404 Not Found - PUT https://registry.npmjs.org/multiple_single_pages - Not found

//解决方案：
npm config set registry https://registry.npmjs.org
npm adduser command[输入npm的账户密码和公共邮箱即可]