jjb-cmd 1.0.17 → 2.0.1

package/src/new/cmd.init.copy/micro-app/jjb.script/config.js

@@ -0,0 +1,222 @@
+// noinspection JSUnresolvedVariable
+
+const path = require('path');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const TerserWebpackPlugin = require('terser-webpack-plugin');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const { CleanWebpackPlugin } = require('clean-webpack-plugin');
+const CssMinimizerWebpackPlugin = require('css-minimizer-webpack-plugin');
+const { requireResolve } = require('./utils');
+const webpack = require('webpack');
+
+const config = require(requireResolve('jjb.config.json'));
+const packageJSON = require(requireResolve('package.json'));
+const server = (config.server || {});
+const framework = (config.framework || {});
+const environment = (config.environment || {})[ process.env.NODE_ENV ];
+const windowInject = {
+  ...(config.windowInject || {}),
+  ...environment,
+  framework
+};
+const contextInject = (config.contextInject || {});
+const contextData = {
+  ...environment,
+  ...contextInject
+};
+
+module.exports = mode => {
+  const isProduction = mode === 'production';
+  return {
+    server,
+    webpack: {
+      // 模式 ‘development’ | ‘production’
+      mode,
+      // 入口
+      entry: './src/index.js',
+      // 输出
+      output: {
+        libraryTarget: 'umd',
+        // 指定输出目录文件名
+        path: path.resolve(__dirname, '../dist'),
+        // 定义全局变量,暴露到‘window’对象中
+        library: packageJSON.name,
+        // 指定编译的‘js’存放目录文件名称
+        filename: 'static/js/[id].js',
+        // 输出公共路径
+        publicPath: '/'
+      },
+      // ‘node.module’
+      module: {
+        // 文件处理
+        rules: [
+          {
+            // 处理‘less’和‘css’文件
+            test: /\.(less|css)$/,
+            // 以此从下到上处理‘css’
+            use: [
+              // 3:由‘webpack.MiniCssExtractPlugin.loader’做收尾工作
+              // 主要分离css文件
+              {
+                loader: MiniCssExtractPlugin.loader
+              },
+              // 2:将被‘less-loader’处理的‘css’
+              // 由‘css-loader’再次处理
+              {
+                loader: 'css-loader'
+              },
+              // 1:处理‘less’文件
+              {
+                // 使用‘less-loader’
+                loader: 'less-loader',
+                // 配置‘less-loader’
+                options: {
+                  // ‘less-loader’特殊配置
+                  lessOptions: {
+                    // 定义‘less’全局变量,从jjb.config.antd获取
+                    modifyVars: (framework || {}).antd || {},
+                    // 启用‘less-javascript’功能
+                    javascriptEnabled: true
+                  }
+                }
+              }
+            ]
+          },
+          {
+            // 处理‘js’文件
+            test: /\.js$/,
+            // 使用‘babel-loader’
+            loader: 'babel-loader',
+            // 允许‘babel-loader’操作目录
+            include: [
+              // 整个‘src’目录
+              path.resolve(__dirname, '../src'),
+              // ‘jjb-dva-runtime’库
+              path.resolve(__dirname, '../node_modules/jjb-dva-runtime'),
+              // ‘jjb-common-decorator’库
+              path.resolve(__dirname, '../node_modules/jjb-common-decorator')
+            ],
+            // 配置‘babel-loader’
+            options: {
+              // 加入一个‘babel-plugin-import’插件,特殊处理‘antd’文件过大问题
+              plugins: [
+                [
+                  'import',
+                  {
+                    // ‘webpack’定义全局变量‘antd’
+                    libraryName: 'antd',
+                    // 按需将‘es’文件夹中组件导出,绑定到‘antd’变量
+                    // 除了‘es’,也可以修改为‘lib’
+                    libraryDirectory: 'es',
+                    // 这里设为‘true’,表示自动导入‘antd/dist/less’
+                    // 或修改为‘css’ | ‘less’
+                    style: true
+                  }
+                ],
+                [
+                  '@babel/plugin-proposal-decorators',
+                  {
+                    'legacy': true
+                  }
+                ]
+              ],
+              // 考虑到使用‘React JSX’语法‘babel-loader’的编译预设要改为‘preset-react’
+              // 可选值‘preset-env’
+              presets: [ '@babel/preset-react' ]
+            }
+          },
+          {
+            // 处理‘svg’文件
+            test: /\.svg/,
+            // 使用‘file-loader’
+            loader: 'file-loader',
+            // 配置‘file-loader’
+            options: {
+              // 指定存储目录
+              outputPath: 'media/svg'
+            }
+          },
+          {
+            // 处理图片文件
+            test: /\.(png|jpg|jpeg|gif|ico|bmp)/,
+            // 使用‘url-loader’或‘raw-loader’
+            loader: 'url-loader',
+            // 配置‘url-loader’
+            options: {
+              // 当文件大小处于(?)byte,输出‘base64’,反之为‘url’.
+              // 这里设为‘false’,表示无论多大多小,都为‘url’.
+              limit: false,
+              // 处理引入地址‘code’编码为‘utf-8’
+              encoding: true,
+              // 若输出为‘url’,需要指定存储目录
+              outputPath: 'media/image'
+            }
+          }
+        ]
+      },
+      // 解析
+      resolve: {
+        // 为‘import’或‘require’定义别名路径
+        alias: {
+          '~': requireResolve('src')
+        }
+      },
+      // 插件
+      plugins: [
+        // 定义输出‘html’模板
+        // 并向‘window’全局注入变量
+        new HtmlWebpackPlugin(Object.assign({ template: requireResolve('public/index.html') }, windowInject)),
+        // 对分离的‘css’区块定义同步导入名称,和异步导入名称
+        new MiniCssExtractPlugin({
+          // 同步导入‘import | require’
+          filename: 'static/css/[id].css',
+          // 异步导入‘import | require’
+          chunkFilename: 'static/css/[id].css'
+        }),
+        // 注入全局变量到项目中,从‘jjb.config.contextData’读取
+        new webpack.DefinePlugin({ 'process.env.app': JSON.stringify(contextData) }),
+        // 解决‘moment.js’本地化文件过多问题
+        // 按需加载本地化文件当前项目只需要‘zh_CN.js’
+        new webpack.IgnorePlugin({
+          contextRegExp: /moment$/,
+          resourceRegExp: /^\.\/locale$/
+        }),
+        // 每次打包前删除‘dist’目录
+        new CleanWebpackPlugin()
+      ],
+      // 外部扩展
+      externals: {
+        'jjb-common-lib': 'jjbCommonLib'
+      },
+      // 打包优化
+      optimization: isProduction
+        ? {
+          // 是否启用优化
+          minimize: true,
+          // 优化插件
+          minimizer: [
+            // 压缩‘javascript’代码
+            new TerserWebpackPlugin({ extractComments: false }),
+            // 压缩‘css’代码
+            new CssMinimizerWebpackPlugin()
+          ],
+          // 分离‘区块’
+          splitChunks: {
+            // 分离范围‘all’即所有
+            chunks: 'all',
+            // 分离大小范围0
+            minSize: 0,
+            // 分离大小范围100000
+            maxSize: 100000,
+            // 同一个区块被调用两次,需要分离
+            minChunks: 2,
+            // 最大异步请求区块
+            maxAsyncRequests: 6,
+            // 最大初始化请求区块
+            maxInitialRequests: 4
+          }
+        }
+        : {}
+    }
+  };
+};

package/src/new/cmd.init.copy/micro-app/jjb.script/proxy.js

@@ -0,0 +1,19 @@
+const express = require('express');
+const history = require('connect-history-api-fallback');
+const app = express();
+const port = '8866';
+
+/**
+ * 单页面应用需要的历史记录模块
+ */
+app.use(history());
+
+/**
+ * 输出静态资源
+ */
+app.use(express.static('../dist'));
+
+/**
+ * 监听端口
+ */
+app.listen(port, () => console.log(`Your application is running here: http://localhost:${port}`));

package/src/new/cmd.init.copy/micro-app/jjb.script/server.js

@@ -0,0 +1,29 @@
+const Server = require('webpack-dev-server');
+const webpack = require('webpack');
+const { hasEnvironment } = require('./utils');
+
+if (!hasEnvironment()) {
+  throw Error('jjb.script[server]: 启动server需要提供NODE_ENV变量，请确认你所运行的脚本是否正确？');
+}
+
+const config = require('./config')('development');
+
+new Server({
+  host: config.server.host || '127.0.0.1',
+  port: config.server.port || '8080',
+  headers: {
+    'Access-Control-Allow-Origin': '*',
+    'Access-Control-Allow-Methods': '*',
+    'Access-Control-Allow-Headers': '*'
+  },
+  compress: true,
+  client: {
+    overlay: {
+      errors: true,
+      warnings: true
+    }
+  },
+  historyApiFallback: {
+    disableDotRule: true
+  }
+}, webpack(config.webpack)).startCallback(() => console.log('jjb.server 服务已启动，正在编译。'));

package/src/new/cmd.init.copy/micro-app/jjb.script/utils.js

@@ -0,0 +1,13 @@
+const path = require('path');
+/**
+ * @description 是否有环境变量‘NODE_ENV’
+ * @return {boolean}
+ */
+exports.hasEnvironment = () => process.env.NODE_ENV !== undefined;
+
+/**
+ * @description 文件解析
+ * @param name {string}
+ * @return {`${string}\\${string}`}
+ */
+exports.requireResolve = name => `${path.resolve(__dirname, '..')}\\${name}`;

package/src/new/cmd.init.copy/micro-app/package.json

@@ -0,0 +1,65 @@
+{
+  "name": "app",
+  "version": "1.0.0",
+  "description": "jjb-base-app",
+  "main": "index.js",
+  "scripts": {
+    "serve": "node jjb.script/server.js",
+    "build": "node jjb.script/build.js",
+    "serve:development": "cross-env NODE_ENV=development npm run serve",
+    "serve:test": "cross-env NODE_ENV=test npm run serve",
+    "serve:release": "cross-env NODE_ENV=release npm run serve",
+    "serve:production": "cross-env NODE_ENV=production npm run serve",
+    "build:development": "cross-env NODE_ENV=development npm run build",
+    "build:test": "cross-env NODE_ENV=test npm run build",
+    "build:release": "cross-env NODE_ENV=release npm run build",
+    "build:production": "cross-env NODE_ENV=production npm run build",
+    "jjb-cmd:install": "jjb-cmd install"
+  },
+  "author": "JJB",
+  "license": "MIT",
+  "devDependencies": {
+    "@babel/core": "^7.19.3",
+    "@babel/plugin-proposal-decorators": "^7.19.3",
+    "@babel/preset-react": "^7.18.6",
+    "babel-loader": "^8.2.5",
+    "babel-plugin-import": "^1.13.5",
+    "clean-webpack-plugin": "^4.0.0",
+    "connect-history-api-fallback": "^2.0.0",
+    "cross-env": "^7.0.3",
+    "css-loader": "^6.7.1",
+    "css-minimizer-webpack-plugin": "^4.2.1",
+    "express": "^4.18.2",
+    "file-loader": "^6.2.0",
+    "html-webpack-plugin": "^5.5.0",
+    "less": "^4.1.3",
+    "less-loader": "^11.1.0",
+    "mini-css-extract-plugin": "^2.6.1",
+    "style-loader": "^3.3.1",
+    "terser-webpack-plugin": "^5.3.6",
+    "uglifyjs-webpack-plugin": "^2.2.0",
+    "url-loader": "^4.1.1",
+    "webpack": "^5.74.0",
+    "webpack-bundle-analyzer": "^4.6.1",
+    "webpack-cli": "^4.10.0",
+    "webpack-dev-server": "^4.11.1"
+  },
+  "dependencies": {
+    "@ant-design/icons": "^4.7.0",
+    "antd": "^4.23.5",
+    "axios": "^1.1.2",
+    "crypto-js": "^4.1.1",
+    "dva": "^2.6.0-beta.22",
+    "history": "^5.3.0",
+    "moment": "^2.29.4",
+    "prop-types": "^15.8.1",
+    "qiankun": "^2.8.3",
+    "react": "^17.0.2",
+    "react-cropper": "^2.1.8",
+    "react-dom": "^17.0.2",
+    "react-router-dom": "^5.2.0",
+    "watch-props": "^0.0.3",
+    "jjb-dva-runtime": "1.0.0",
+    "jjb-common-decorator": "1.0.0"
+  }
+}

package/src/new/cmd.init.copy/micro-app/public/index.html

@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="zh">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="renderer" content="webkit">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1">
+    <title>
+      <%= htmlWebpackPlugin.options.title %>
+    </title>
+    <script>
+      window.__JJB_ENVIRONMENT = {
+        API_HOST: '<%= htmlWebpackPlugin.options.API_HOST %>',
+        FRAMEWORK: JSON.parse('<%= JSON.stringify(htmlWebpackPlugin.options.framework.antd) %>')
+      };
+    </script>
+    <script src="<%= htmlWebpackPlugin.options.jjbCommonLibUrl %>"></script>
+  </head>
+  <body>
+    <noscript>此网页需要开启JavaScript功能。</noscript>
+    <div id="root" style="width: 100%; height: 100%; position: relative"></div>
+  </body>
+</html>

package/src/new/cmd.init.copy/micro-app/src/enumerate/namespace/index.js

@@ -0,0 +1,3 @@
+import { defineNamespace } from 'jjb-dva-runtime';
+
+export const NS_MAIN = defineNamespace('main');

package/src/new/cmd.init.copy/micro-app/src/index.js

@@ -0,0 +1,24 @@
+import { setup } from 'jjb-dva-runtime';
+
+const app = setup();
+
+/**
+ * @description 挂载
+ * @param props {object}
+ * @returns {Promise<*>}
+ */
+export const mount = async props => app.mount(props);
+
+/**
+ * @description 卸载
+ * @param props {object}
+ * @returns {Promise<*>}
+ */
+export const unmount = async props => app.unmount(props);
+
+/**
+ * @description 启动
+ * @param props
+ * @returns {Promise<*>}
+ */
+export const bootstrap = async props => app.bootstrap(props);

package/src/new/cmd.init.copy/micro-app/src/models/main/index.js

@@ -0,0 +1,9 @@
+import { NS_MAIN } from '~/enumerate/namespace';
+import { registerModel } from 'jjb-dva-runtime';
+
+export default registerModel(NS_MAIN, {
+  state: {
+    loading: false
+  },
+  effects: {}
+});

package/src/new/cmd.init.copy/micro-app/src/pages/index.js

@@ -0,0 +1,11 @@
+import React from 'react';
+
+export default class App extends React.Component {
+  render () {
+    return (
+      <div>
+        Hello World!
+      </div>
+    );
+  }
+}

package/src/new/cmd.init.copy/micro-app/webstorm.config.js

@@ -0,0 +1,18 @@
+'use strict';
+const path = require('path');
+
+function resolve (dir) {
+  return path.join(__dirname, '.', dir);
+}
+
+module.exports = {
+  context: path.resolve(__dirname, './'),
+  resolve: {
+    extensions: [ '.js' ],
+    alias: {
+      '~': resolve('src/'),
+      'common': resolve('src/common'),
+      'components': resolve('src/components')
+    }
+  }
+};

package/src/new/cmd.init.copy/react-component/jjb.config.json

@@ -0,0 +1,33 @@
+{
+  "projectType": "micro-spa",
+  "installTarget": "node_modules",
+  "installResources": [],
+  "environment": {
+    "development": {
+      "API_HOSE": ""
+    },
+    "test": {
+      "API_HOSE": ""
+    },
+    "release": {
+      "API_HOSE": ""
+    },
+    "production": {
+      "API_HOSE": ""
+    }
+  },
+  "contextInject": {},
+  "windowInject": {},
+  "server": {
+    "port": "8066",
+    "host": "127.0.0.1"
+  },
+  "framework": {
+    "antd": {
+      "ant-prefix": "test",
+      "link-color": "red",
+      "primary-color": "red",
+      "border-radius-base": "2px"
+    }
+  }
+}

package/src/new/cmd.init.copy/react-component/jjb.script/build.js

@@ -0,0 +1,11 @@
+const { hasEnvironment } = require('./utils');
+
+if (!hasEnvironment()) {
+  throw Error('jjb.script[build]: 启动build需要提供NODE_ENV变量，请确认你所运行的脚本是否正确？');
+}
+
+require('webpack')(require('./config')('production').webpack).run(err => {
+  if (!err) {
+    console.log('项目打包完成！');
+  }
+});

package/src/new/cmd.init.copy/react-component/jjb.script/config.js

@@ -0,0 +1,159 @@
+// noinspection JSUnresolvedVariable
+
+const path = require('path');
+const { CleanWebpackPlugin } = require('clean-webpack-plugin');
+const { requireResolve } = require('./utils');
+const webpack = require('webpack');
+
+const config = require(requireResolve('jjb.config.json'));
+const packageJSON = require(requireResolve('package.json'));
+const server = (config.server || {});
+const environment = (config.environment || {})[ process.env.NODE_ENV ];
+const windowInject = (config.windowInject || {});
+const contextInject = (config.contextInject || {});
+const contextData = {
+  ...environment,
+  ...contextInject
+};
+
+module.exports = mode => {
+  const isProduction = mode === 'production';
+  return {
+    server,
+    webpack: {
+      // 模式 ‘development’ | ‘production’
+      mode,
+      // 入口
+      entry: './src/index.js',
+      // 输出
+      output: {
+        // 指定输出目录文件名
+        path: path.resolve(__dirname, '../dist'),
+        // 定义全局变量,暴露到‘window’对象中
+        library: packageJSON.name,
+        // 指定编译的‘js’存放目录文件名称
+        filename: 'index.js',
+        // 输出公共路径
+        publicPath: '/',
+        // 默认暴露‘window’此处修改为暴露到‘exports’中
+        libraryTarget: 'umd'
+      },
+      // ‘node.module’
+      module: {
+        // 文件处理
+        rules: [
+          {
+            // 处理‘less’和‘css’文件
+            test: /\.(less|css)$/,
+            // 以此从下到上处理‘css’
+            use: [
+              {
+                loader: 'style-loader'
+              },
+              // 2:将被‘less-loader’处理的‘css’
+              // 由‘css-loader’再次处理
+              {
+                loader: 'css-loader'
+              },
+              // 1:处理‘less’文件
+              {
+                // 使用‘less-loader’
+                loader: 'less-loader',
+                // 配置‘less-loader’
+                options: {
+                  // ‘less-loader’特殊配置
+                  lessOptions: {
+                    // 定义‘less’全局变量,从jjb.config.antd获取
+                    modifyVars: (config.framework || {}).antd || {},
+                    // 启用‘less-javascript’功能
+                    javascriptEnabled: true
+                  }
+                }
+              }
+            ]
+          },
+          {
+            // 处理‘js’文件
+            test: /\.js$/,
+            // 使用‘babel-loader’
+            loader: 'babel-loader',
+            // 允许‘babel-loader’操作目录
+            include: [
+              // 整个‘src’目录
+              path.resolve(__dirname, '../src'),
+              // ‘jjb-common’库
+              path.resolve(__dirname, '../node_modules/jjb-common'),
+              // ‘jjb-react-admin-component’库
+              path.resolve(__dirname, '../node_modules/jjb-react-admin-component')
+            ],
+            // 配置‘babel-loader’
+            options: {
+              // 加入一个‘babel-plugin-import’插件,特殊处理‘antd’文件过大问题
+              plugins: [
+                [
+                  'import',
+                  {
+                    // ‘webpack’定义全局变量‘antd’
+                    libraryName: 'antd',
+                    // 按需将‘es’文件夹中组件导出,绑定到‘antd’变量
+                    // 除了‘es’,也可以修改为‘lib’
+                    libraryDirectory: 'es'
+                    // 这里设为‘true’,表示自动导入‘antd/dist/less’
+                    // 或修改为‘css’ | ‘less’
+                    // style: true
+                  }
+                ],
+                [
+                  '@babel/plugin-proposal-decorators',
+                  {
+                    'legacy': true
+                  }
+                ]
+              ],
+              // 考虑到使用‘React JSX’语法‘babel-loader’的编译预设要改为‘preset-react’
+              // 可选值‘preset-env’
+              presets: [ '@babel/preset-react' ]
+            }
+          },
+          {
+            // 处理图片文件
+            test: /\.(png|jpg|jpeg|gif|ico|bmp)/,
+            // 使用‘url-loader’或‘raw-loader’
+            loader: 'url-loader',
+            // 配置‘url-loader’
+            options: {
+              // 当文件大小处于(?)byte,输出‘base64’,反之为‘url’.
+              // 这里设为‘false’,表示无论多大多小,都为‘url’.
+              limit: true
+            }
+          }
+        ]
+      },
+      // 解析
+      resolve: {
+        // 为‘import’或‘require’定义别名路径
+        alias: {
+          '~': requireResolve('src')
+        }
+      },
+      externals: {
+        'jjb-common-lib': 'jjbCommonLib',
+        'react': 'React',
+        'react-dom': 'ReactDOM',
+      },
+      // 插件
+      plugins: [
+        // 注入全局变量到项目中,从‘jjb.config.contextData’读取
+        new webpack.DefinePlugin({ 'process.env.app': JSON.stringify(contextData) }),
+        // 解决‘moment.js’本地化文件过多问题
+        // 按需加载本地化文件当前项目只需要‘zh_CN.js’
+        new webpack.IgnorePlugin({
+          contextRegExp: /moment$/,
+          resourceRegExp: /^\.\/locale$/
+        }),
+        // 每次打包前删除‘dist’目录
+        new CleanWebpackPlugin()
+      ]
+    }
+  };
+};

package/src/new/cmd.init.copy/react-component/jjb.script/proxy.js

@@ -0,0 +1,22 @@
+const express = require('express');
+const history = require('connect-history-api-fallback');
+const cors = require('cors');
+const app = express();
+const port = '8566';
+
+app.use(cors('*'));
+
+/**
+ * 单页面应用需要的历史记录模块
+ */
+app.use(history());
+
+/**
+ * 输出静态资源
+ */
+app.use(express.static('../dist'));
+
+/**
+ * 监听端口
+ */
+app.listen(port, () => console.log(`Your application is running here: http://localhost:${port}`));