jujin-dv

项目描述

• jujin-dv 是一款实现前后端分离开发的构建工具

• 工具构建的前端项目可基于 react 和 antd

antd 即 ant design 是蚂蚁金服旗下的企业级后台产品，有助于快速实现中后台前端需求

先决条件

• node v16.13.2

开发步骤

• A. 下载构建工具

通过 npm install -g jujin-dv 安装。

• B. 使用构建工具创建项目

新建项目文件夹，例如：xxx。在 xxx 下打开命令行工具，执行 jjdv init 初始化一个前端项目。

• C. 使用构建工具运行项目

在 xxx 命令行目录下，执行 jjdv server。启动 server 后，浏览器地址栏输入 http://localhost:8000 访问新建的项目。

• D. 使用构建工具构建项目

在 xxx 命令行目录下，执行 jjdv build 生成生产环境使用的 js、html 文件。

项目说明

• 注意事项

构建工具基于 webpack，默认不打包 react react-dom react-router-dom antd moment 需要在 html 中引入相应的 js 脚本；如果想要修改该规则，则可编辑 jujin-dv/lib/webpack.common.config.js 的如下代码片段

function resolveExternals(externals, globalConfig) {
    var defaults = {
        React: 'window.React',
        react: 'window.React',
        ReactDOM: 'window.ReactDOM',
        'react-dom': 'window.ReactDOM',
        ReactRouterDOM: 'window.ReactRouterDOM',
        'react-router-dom': 'window.ReactRouterDOM',
        antd: 'window.antd',
        moment: 'window.moment',
        'global-config': JSON.stringify(globalConfig),
    }
    ...
};

• 命令详解

a. jjdv server [-p|-x|-r|-s|-c]

-p 参数表示 server 启动的端口号，默认为 8000。端口被占用时可通过 -p 参数指定端口号。

-x 参数表示 server 代理地址，若指定 -x http://www.baidu.com 则所有请求会被转发到 baidu，并返回结果。

-r 参数表示 server 代理转发的前缀，若指定 -r abc 则所有以 /abc 为前缀的请求才会被转发至 -x 指定的代理服务器。

-s 参数表示 是否去除 -r 参数所表示的路径前缀 默认值为去除 当 -s false 时为不去除 例如：-x http://localhost:8080 -r abc 表示 /abc/test 访问的是 http://localhost:8080/test 如果加上 -s false 表示访问的是 http://localhost:8080/abc/test

-c 参数表示是否独立打包 css 文件。

b. jjdv build [-o|-d|-c]

-o 参数表示指定打包文件输出目录。

-d 参数表示启用调试模式打包，不压缩输出文件。

-c 参数同 jjdv server 命令。