everest-cli

everest-cli，提供`init` 、`start`、 `build` 、 `test` 、`lint` 等命令，具体可以通过 `everest -h` 查看

Getting Started

安装

$ npm install @uyun/everest -g --registry=http://rnpm.uyundev.cn

使用

初始化项目

$ everest init <appName>

本地开发

$ everest start

打包发布

$ everest build

代码测试,默认测试src目录下的所有相关test文件

$ everest test

代码检测，目前采用standard规范

$ everest lint

修正代码

$ everest lint:fix

模块迁移，主要针对需要重构的模块进行迁移打包

$ everest patch

二次开发

$ everest redevelop

主要运用场景
* 基于产品提供出来的配置进行修改，比如修改左侧菜单的文本
* 基于打包出去的代码进行二次开发，比如ITSM打包出去需要添加值班管理模块
* 基于产品提供出去的业务模块进行开发，比如合作伙伴需要嵌入monitor资源圈模块

配置

关于配置的需要注意的地方：

目前cli集成常见的构建配置，如果需要配置可以在根目录新建.evrest.json 进行添加

常见的配置有:

{
    "vars": {
        "frontendUrl": ["./script", "/frontend"],
        "title": "CMDB"
    },
    "entryChunk": {
        "index": "./src/entry/main.jsx",
        "graph": "./src/entry/graph.jsx",
        "config": "./src/entry/config.jsx",
        "print": "./src/entry/print.jsx"
    },
    "commonChunk": {
      "vendor": [
        "./config/polyfills",
        "react",
        "react-dom",
        "react-router",
        "lodash",
        "redux",
        "redux-thunk",
        "immutable",
        "codemirror",
        "simditor",
        "d3",
        "d3-tip",
        "moment",
        "history"
      ]
    },
    "provider": {
      "$": "jquery",
      "_": "lodash",
      "moment": "moment",
      "cls": "classnames",
      "Immutable": "immutable"
    }
    "template": [
      {
        "path": "./public/index.html",
        "entry": "index"
      },
      {
        "path": "./public/graph.html",
        "entry": "graph"
      }
    ],
    "proxy": [{
        "context": ["/tenant/**", "/api/**","/notify/**","/frontend/**"],
        "target": "http://10.1.11.235:8800",
        "secure": false
    }],
    "alias": {
      "Utils": "../../../utils"
    }
  }

如果部分需要项目支持特殊配置，可以通过在根目录下添加webpack.config.js中并进行配置，一般情况下无需用到该方法

比如

指定浏览器打开

const WebpackBrowserPlugin = require('webpack-browser-plugin')
module.exports = function (webpackConfig, env) {
  webpackConfig.plugins.push(
    new WebpackBrowserPlugin({
      browser: 'Firefox',
      port: 4000,
      url: 'http://10.1.51.3'
    })
  )
  return webpackConfig
}

默认只支持less编译，需要支持sass

const path = require('path')
module.exports = function(webpackConfig){
const rule = {
    test: /\.scss$/,
    include: [path.resolve('./src/components/')],
    use: ['style-loader', {
        loader: 'css-loader',
        options: {
            modules: true,
            localIdentName: '[local]_[hash:base64:5]'
        }
    }, 'sass-loader']
}
webpackConfig.module.rules.push(rule)

return webpackConfig
}

其中webpackConfig已经包含了相关的基础配置，env配置环境，webpackConfig可配置的属性，请查看https://doc.webpack-china.org/configuration/devtool/#devtool

vars

html变量：如果要在html文件插入变量可以配置该参数

"vars": {
    "frontendUrl": ["./script", "/frontend"],
    "title": "CMDB"
}

配置数据有两种格式:数组和字符串

其中数组表示development和production变量，区分顺序

在html文件可以按照如下方式引用：

<title>%title%</title>

<script src="%frontendUrl%/Layout-public.min.js"></script>

entryChunk

配置多页面入口

entryChunk: {
  "index": "./src/entry/main.jsx",
  "graph": "./src/entry/graph.jsx",
}

配置地址默认是项目根目录，也就是.everest.json所在的目录

commonChunk

配置公共模块入口：需要提取页面的公共模块

"commonChunk": {
  "polyfills": ["babel-polyfill", "event-source-polyfill"],
  "verndor": [
    "react",
    "react-dom"
  ]
}

template

配置页面模板

"template": [
  {
    "path": "./public/index.html",
    "entry": "index"
  }
]

path 模板地址 entry 入口值必须 entryChunk 配置的一致，否则无法找到入口

provider

配置该参数会自动导入模块，无需在模块手动导入该模块

比如在index.js中使用了immutable 可以直接使用Immutable 无需手动导入immutable模块

ps:如果默认开了eslint检查会提示未定义错误

extraBabelPlugins

配置额外的 babel plugin。babel plugin 只能添加，不允许覆盖和删除, 比如：

"extraBabelPlugins": [
        [
            "import",
            {
              "libraryName": "@uyun/uyd",
              "style": true
            }
        ]
    ]

proxy

配置代理，详见 webpack-dev-server#proxy

如果要代理请求到其他服务器，可以这样配：

"proxy": {
  "/tenant":{
    "target": "http://web.uyundev.cn",
    "secure": false
  },
  "/frontend":{
    "target": "http://web.uyundev.cn/",
    "secure": false
  }
}

也可以配置成数组格式：

"proxy": [{
    "context": ["/tenant/**", "/api/**","/notify/**","/frontend/**"],
    "target": "http://10.1.11.235:8800",
    "secure": false
}]

alias

别名配置

日常开发代码中，由于目录结构的划分，会导致出现类似代码

import getCookie from '../../utils/getCookie'

这样的路径太繁琐，需要配置别名，配置如下

"alias": {
  "Util": "../../util"
}

添加日志监控

需在模板头部添加代码

<% if (htmlWebpackPlugin.options.env) { %>
  %MONITOR%
<% } %>

该代码只会在开发环境生效，不会影响到生产环境

环境变量

可环境变量临时配置一些参数，包括：

PORT, 端口号，默认 8000
BROWSER，设为 none 时不自动打开浏览器
HOST, 默认 localhost

比如，使用 3000 端口开启服务器可以这样：

# OS X, Linux
$ PORT=3000 everest start

# Windows (cmd.exe)
$ set PORT=3000&&everest start

# Or use cross-env for all platforms
$ cross-env PORT=3000 everest start

默认使用 `public` 目录

我们约定 public 目录下的文件会在 server 和 build 时被自动 copy 到输出目录（默认是 ./build) favicon, iconfont, html, html 里引用的图片等

Current Tags

4.2.0-beta ... beta (7 years ago)
4.3.0-beta.1 ... beta.1 (7 years ago)
4.3.0-beta.2 ... beta.2 (7 years ago)
4.2.0-beta2 ... beta2 (7 years ago)
4.2.0-beta3 ... beta3 (7 years ago)
4.2.0-beta4 ... beta4 (7 years ago)
4.3.6 ... latest (6 years ago)