项目简介

• 提供命令行工具 sp-scripts

  sp-scripts --help 获取帮助 sp-scripts new PROJECT_NAME 创建微前端子应用模板代码 sp-scripts new -t main PROJECT_NAME 创建微前端主应用模板代码

• 提供全局的 webpack 配置文件，在模板项目里面通过安装 sp-scripts 来实现

• 提供自动化构建部署脚本，通过 config.js 配置

使用

1, 配置 registry

 npm config set registry https://tmobile.dgg188.cn

2, 全局安装

 yarn global add temp-test-scripts
 npm install -g temp-test-scripts

3, 创建模板项目

sp-scripts new PROJECT_NAME
或者
sp-scripts new -t main PROJECT_NAME

4, 在项目根目录下安装依赖包

yarn

sp-scripts 版本管理和发布

每次发布 sp-scripts 的时候，需要首先将 package.json 里面的 version 版本号升级, 然后执行下面的命令。

npm publish

关于 vendor

我们的基础架构会将不常更改的三方库，例如 vue 等（配置scripts/vendor.js），打包到 vendor 目录中。

需要注意的是，vendor 是由版本号控制(utils.js中的 vendorVersion)的。每次修改scripts/vendor.js中的三方包，都需要将版本号+1，然后发现新一版的 sp-scripts。

在产品功能发布中，一个 vendor 版本号只能被构建一次，不允许重复使用一个版本号进行多次构建。

没有特殊情况，不要私自向 package.json 中添加三方依赖。

技术栈

vue+single-spa+webpack+babel+eslint+jenkins

模板代码目录结构说明

各目录以实际项目为准，以下为常用目录：

• api 接口请求

• assets 为静态资源目录，有 images、styles、fonts 等。

• components 为通用组件目录。

• constants 为常量目录。

• router 路由配置

• store 全局状态

• utils 工具方法

• views 各路由模块

• plugins 插件模块

• config 配置