loginwithreg-309

loginwithreg-309项目

Scripts

脚本

{
    "serve": "vue-cli-service serve --open",
    "build": "vue-cli-service build --mode=production",
    "dev": "npm run serve",
    "dist": "vue-cli-service lint && node ./build/index.js",
    "lint": "vue-cli-service lint --fix",
    "test:unit": "vue-cli-service test:unit",
    "pub": "npm publish --registry=http://npm.devops.erp.ocj.com.cn --scope=@ocj",
    "clean": "npm cache clear --force",
    "init": "npm cache clear --force && npm install --registry http://npm.devops.erp.ocj.com.cn",
    "deploy": "node map/deploy.js"
}

Customize configuration

See Configuration Reference.

项目目录介绍

├── babel.config.js //babel 配置文件
├── jest.config.js //jest 配置文件
├── publishConf.yaml //项目发布时 acm 基础配置，指定引用资源文件版本
├── postcss.config.js //postcss 配置
├── public
│   ├── favicon.ico //项目 favicon
│   └── index.html //项目模版 html 文件
├── shell.config //埋点配置文件
├── src
│   ├── api //网络请求配置文件
│   │   ├── dev.js
│   │   ├── index.js
│   │   └── prod.js
│   ├── app.js //项目主入口
│   ├── assets //项目资源目录
│   │   └── logo.png
│   ├── basic //项目基础组件
│   │   ├── app.vue
│   │   └── sideMenu.js
│   ├── components //项目公用组件
│   │   ├── component1
│   │   │   ├── component1.js
│   │   │   ├── component1.scss
│   │   │   └── component1.vue
│   │   ├── component2
│   │   │   ├── component2.js
│   │   │   ├── component2.scss
│   │   │   └── component2.vue
│   │   ├── component3
│   │   │   ├── component3.js
│   │   │   ├── component3.scss
│   │   │   └── component3.vue
│   │   ├── component4
│   │   │   ├── component4.js
│   │   │   ├── component4.scss
│   │   │   └── component4.vue
│   │   ├── components.js //提供给外部项目的列表文件
│   │   └── index.js //公共组件入口
│   ├── pages //项目页面列表
│   │   ├── index.js
│   │   ├── test1
│   │   │   ├── blocks
│   │   │   │   └── index.vue
│   │   │   ├── test1.js
│   │   │   ├── test1.scss
│   │   │   └── test1.vue
│   │   └── test5
│   │   ├── blocks
│   │   │   └── index.vue
│   │   ├── test5.js
│   │   ├── test5.scss
│   │   └── test5.vue
│   ├── router.js //路由配置文件
│   ├── sass
│   │   ├── base.scss //项目基础样式
│   │   └── button
│   │   └── index.scss
│   └── store.js //项目 vuex 配置文件
├── tests //单元测试
│   └── unit
│   └── example.spec.js
└── vue.config.js //webpack 配置文件

项目联合云效发布流程

第一步：去云效果创建项目

语雀云效开发文档

第二步：切换到对应的开发分支上比如(20190606094936394_1000097)分支

git checkout 20190606094936394_1000097

第三步：修改 app.js 文件中的 webpackpublicpath(传递的参数为当前项目名称)

__webpack_public_path__ = ocj.path("ocj-cli-template");

第四步：修改 index.html 中的依赖库版本号

    <script src=https://ocj-erp-frontenddaily.oss-cn-shanghai.aliyuncs.com/common/v0.0.2/ocj.js tag="20190606094936394_1000097"></script> //tag改为云效上发布完毕后的版本号20190606094936394_1000097
    <script src=https://ocj-erp-frontenddaily.oss-cn-shanghai.aliyuncs.com/ocj-cli-template/20190606094936394_1000097/js/app.js></script> //添加入口文件修改为云效上发布完毕后的版本号20190606094936394_1000097

项目远程连接本地调试流程

背景：

由于我们项目最终是发布到云效上，模版 html 文件依赖云效上的 js 文件，解决后台登录状态跟同域中各种存放在 session 跟 cookie 中的值以及跨域问题。

步骤：

第一步：

在需要远程调试的链接上添加 dev=debug参数 比如我们需要远程调试的地址为：http://10.22.1.32:8080/ocj-cli-template/dist/index.html

    http://10.22.1.32:8080/ocj-cli-template/dist/index.html?dev=_debug_#/

第二步：

开启本地服务

   npm run serve

第三步：

允许本地服务支持跨域访问（主要为了支持 webpack 的热载功能） navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)