前端开发规范-开发流程,针对使⽤三方库链接的限制,公共资源库

安逸和尚easymonk

2022-01-28 105 阅读3分钟

前端开发规范-开发流程,针对使⽤三方库链接的限制,公共资源库

开发流程

环境

可以使用 web_dev 的 docker 镜像，参考脚本svn.i.XXX.cn:88/svn/baobao/…
或⾃行安装 nodejs 环境
统一的 docker 环境(20191220-更新建议使用)

为了保证开发环境统一，建议选择此环境来开发; 镜像地址在 svn.i.XXX.cn:88/svn/baobao/…

该环境基于 vuecli4 进行定制过来的;一些设置需要详细查看svn.i.XXX.cn:88/svn/baobao/…

需要 termrun 工具来处理优点:省去重复部署构建环境的乏味工作，直接创建项目开发

更新日志: 20191220 添加
开发 svn 根目录 svn.i.XXX.cn:88/svn/baobao/…
发布 svn 根目录 svn.i.XXX.cn:88/svn/baobao/…

开发流程

复制 demo ⼯程到相应目录
- vue demo 项目 svn.i.XXX.cn:88/svn/baobao/…
- mis 项目 svn.i.XXX.cn:88/svn/baobao/…
修改 index.html 文件中的 title 标签
修改 package.json 文件中的 name, version, author 选项
修改 config/index.js 文件中的 proxyTable, assetsPublicPath, svn 选项
执行 npm install 命令安装 npm 依赖包
执行 npm run dev 命令开启调试
开发项目
开发完成后执行 npm run build 命令构建项目
构建完成后执行 npm run release 命令发布并上线

若是使⽤用统一的 docker 环境去开发(20191220-更新建议使用)

创建 app 命令;在新的空⽬录下执⾏命令
- mis 项目 termrun cmsCreate ，会在该⽬录下创建 app 文件(仅包含 src 内部内容)
- h5 项目 termrun actCreate ，会在该目录下创建 src 文件夹和 peoject.json 配置文件
修改⽬录下的 index.html ⽂件中的 title 标签

修改项目的配置文件

mis 项目的配置⽂件在目录下 projectConf.js 文件

module.exports = {
  type: 'cms',
  name: '', // 项目名字
  proxyTableUrl: '', // 代理地址
  svnPath: '', // svn提交地址
}

h5 项目的配置⽂件在 src 目录同级， project.json

注意:测试地址一般会在项⽬目录同级的 h5Test 目录里

{
    "type":"act",// 类别
    "name": "tmp",//名字
    "author": "zhengguozhi",//第一作者
    "testSubPath": "",// 测试提交地址 测试地址一般会在项⽬目录同级的`h5Test`⽬录里
    "subPath": "",//线上提交地址
    "ways": "svn",//弃⽤
    "proxyTableUrl": "https://www.XXX.cn",//代理地址
    "rootValue": 750,//设计稿宽度
    "VERSION": "v-0.0.1"
}

开发项目命令 mis 项目 termrun cmsDev [prot=1800] ，h5 项目 termrun actDev [prot=1900] ;若是由于端⼝占用开启失败，会自增 1 到可用端口
构建命令
- mis termrun cmsBuild
- h5 termrun actBM h5 项目将构建两个版本打包⽂件;(现在版本，兼容版本)
上线
- mis termrun cmsRelease [commont] commont 是上线⽇志
- h5 termrun actRelease [type] [commont] type 是上线类别:1 是测试;2 是线上; commont 是上线⽇志

针对使⽤三方库链接的限制(20210114)

由于三方库链接访问是有局限性，不确定性等因素;不建议直接⽤链接⽅式使用在项目中;若是用到三方库，可以尝试打包在项目包内;或者项目的服务器上;访问域名为项目的域名。若在项目中使用了三方库的外链请及时更正过来;若因此影响项目访问会影响 KPI。

公共资源库(20191220-h5 项目使用)

针对 h5 项目有一个公共资源库;zhengguozhi@svn.i.XXX.cn:88/svn/baobao/…

其目录结构是:

common 一些常用的 js/css 预设值

/stylus/variable.styl 这个是公共的预设值;

components 一些公共组件

注意: 在添加组件时功能时记得默认功能;以免老项⽬目有问题在组件有很⼤的改变时，建议新建⽂件(夹)提升组件版本来处理

eryuSdk app 内部交互 sdk
mixins 一些工具⽅法
plugins 一些 js 方法/插件
siger 签名方法

签名方法:需要设定项目的签名配置

友情链接：