github/lowcode-engine
1
0
Fork 0
mirror of https://github.com/alibaba/lowcode-engine.git synced 2026-01-13 01:21:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'feat/code-gen-export-tools' into 'release/0.9.0'

Browse Source 
增加 Zip 产出插件 & 增加自定义定制 demo

1. 修复 condition 代码生成的 bug
2. 增加 zip 产出 publisher
3. 增加自定义定制生成器的 demo


See merge request !895638
This commit is contained in:
康为 2020-07-16 12:45:22 +08:00
commit 806ddb4b7e
15 changed files with 363 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.gitignore vendored
View File

@ -4,6 +4,7 @@ dist
packages/*/lib/
packages/*/es/
packages/*/dist/
packages/*/output/
package-lock.json
yarn.lock
deploy-space/packages
@ -102,4 +103,4 @@ typings/
.DS_Store
# codealike
codealike.json
codealike.json

103
packages/code-generator/demo/demo.js
View File

@ -1,4 +1,5 @@
const fs = require('fs');
// ../lib 可以替换成 @ali/lowcode-code-generator
const CodeGenerator = require('../lib').default;
function flatFiles(rootName, dir) {
@ -50,4 +51,104 @@ function main() {
});
}
main();
function exportModule() {
const schemaJson = fs.readFileSync('./demo/shenmaSample.json', { encoding: 'utf8' });
const moduleBuilder = CodeGenerator.createModuleBuilder({
plugins: [
CodeGenerator.plugins.react.reactCommonDeps(),
CodeGenerator.plugins.common.esmodule({
fileType: 'jsx',
}),
CodeGenerator.plugins.react.containerClass(),
CodeGenerator.plugins.react.containerInitState(),
CodeGenerator.plugins.react.containerLifeCycle(),
CodeGenerator.plugins.react.containerMethod(),
CodeGenerator.plugins.react.jsx(),
CodeGenerator.plugins.style.css(),
],
postProcessors: [
CodeGenerator.postprocessor.prettier(),
],
mainFileName: 'index',
});
moduleBuilder.generateModuleCode(schemaJson).then(result => {
displayResultInConsole(result);
return result;
});
}
function exportProject() {
const schemaJson = fs.readFileSync('./demo/sampleSchema.json', { encoding: 'utf8' });
const builder = CodeGenerator.createProjectBuilder({
template: CodeGenerator.solutionParts.icejs.template,
plugins: {
components: [
CodeGenerator.plugins.react.reactCommonDeps(),
CodeGenerator.plugins.common.esmodule({
fileType: 'jsx',
}),
CodeGenerator.plugins.react.containerClass(),
CodeGenerator.plugins.react.containerInitState(),
CodeGenerator.plugins.react.containerLifeCycle(),
CodeGenerator.plugins.react.containerMethod(),
CodeGenerator.plugins.react.jsx(),
CodeGenerator.plugins.style.css(),
],
pages: [
CodeGenerator.plugins.react.reactCommonDeps(),
CodeGenerator.plugins.common.esmodule({
fileType: 'jsx',
}),
CodeGenerator.plugins.react.containerClass(),
CodeGenerator.plugins.react.containerInitState(),
CodeGenerator.plugins.react.containerLifeCycle(),
CodeGenerator.plugins.react.containerMethod(),
CodeGenerator.plugins.react.jsx(),
CodeGenerator.plugins.style.css(),
],
router: [
CodeGenerator.plugins.common.esmodule(),
CodeGenerator.solutionParts.icejs.plugins.router(),
],
entry: [
CodeGenerator.solutionParts.icejs.plugins.entry(),
],
constants: [
CodeGenerator.plugins.project.constants(),
],
utils: [
CodeGenerator.plugins.common.esmodule(),
CodeGenerator.plugins.project.utils(),
],
i18n: [
CodeGenerator.plugins.project.i18n(),
],
globalStyle: [
CodeGenerator.solutionParts.icejs.plugins.globalStyle(),
],
htmlEntry: [
CodeGenerator.solutionParts.icejs.plugins.entryHtml(),
],
packageJSON: [
CodeGenerator.solutionParts.icejs.plugins.packageJSON(),
],
},
postProcessors: [
CodeGenerator.postprocessor.prettier(),
],
});
builder.generateProject(schemaJson).then(result => {
displayResultInConsole(result);
writeResultToDisk(result, 'output/lowcodeDemo').then(response =>
console.log('Write to disk: ', JSON.stringify(response)),
);
return result;
});
}
// main();
// exportModule();
exportProject();

36
packages/code-generator/demo/shenmaSample.json Normal file
View File

@ -0,0 +1,36 @@
{
"version": "1.0.0",
"componentsMap": [
{
"componentName": "Demo",
"package": "@ali/demo",
"version": "1.19.18",
"destructuring": true,
"exportName": "Demo"
}
],
"id": "page_kc326r8m",
"componentsTree": [{
"componentName": "Page",
"id": "node_kc326r8h",
"props": {},
"condition": true,
"loopArgs": ["item", "index"],
"children": [{
"componentName": "Demo",
"id": "node_kc326r8i",
"props": {
"value": "文本内容",
"color": "#ffffff",
"ui_maxLine": 2,
"url": "",
"ui_type": "xs",
"style": {},
"className": ""
},
"condition": true,
"loopArgs": ["item", "index"]
}]
}],
"params": {}
}

4
packages/code-generator/package.json
View File

@ -4,7 +4,8 @@
"description": "出码引擎 for LowCode Engine",
"main": "lib/index.js",
"files": [
"lib"
"lib",
"demo"
],
"scripts": {
"build": "rimraf lib && tsc",
@ -21,6 +22,7 @@
"@babel/types": "^7.9.5",
"@types/prettier": "^1.19.1",
"change-case": "^3.1.0",
"jszip": "^3.5.0",
"prettier": "^2.0.2",
"short-uuid": "^3.1.1"
},

25
packages/code-generator/src/index.ts
View File

@ -5,11 +5,17 @@
import { createProjectBuilder } from './generator/ProjectBuilder';
import { createModuleBuilder } from './generator/ModuleBuilder';
import { createDiskPublisher } from './publisher/disk';
import { createZipPublisher } from './publisher/zip';
import createIceJsProjectBuilder from './solutions/icejs';
import createRecoreProjectBuilder from './solutions/recore';
// 引入说明
import { REACT_CHUNK_NAME } from './plugins/component/react/const';
import {
COMMON_CHUNK_NAME,
CLASS_DEFINE_CHUNK_NAME,
DEFAULT_LINK_AFTER,
} from './const/generator';
// 引入通用插件组
import esmodule from './plugins/common/esmodule';
@ -26,6 +32,7 @@ import css from './plugins/component/style/css';
import constants from './plugins/project/constants';
import i18n from './plugins/project/i18n';
import utils from './plugins/project/utils';
import prettier from './postprocessor/prettier';
// 引入常用工具
import * as utilsCommon from './utils/common';
@ -34,6 +41,9 @@ import * as utilsJsExpression from './utils/jsExpression';
import * as utilsNodeToJSX from './utils/nodeToJSX';
import * as utilsTemplateHelper from './utils/templateHelper';
// 引入内置解决方案模块
import icejs from './plugins/project/framework/icejs';
export * from './types';
export default {
@ -43,8 +53,12 @@ export default {
icejs: createIceJsProjectBuilder,
recore: createRecoreProjectBuilder,
},
solutionParts: {
icejs,
},
publishers: {
disk: createDiskPublisher,
zip: createZipPublisher,
},
plugins: {
common: {
@ -70,6 +84,9 @@ export default {
utils,
},
},
postprocessor: {
prettier,
},
utils: {
common: utilsCommon,
compositeType: utilsCompositeType,
@ -77,4 +94,12 @@ export default {
nodeToJSX: utilsNodeToJSX,
templateHelper: utilsTemplateHelper,
},
chunkNames: {
COMMON_CHUNK_NAME,
CLASS_DEFINE_CHUNK_NAME,
REACT_CHUNK_NAME,
},
defaultLinkAfter: {
COMMON_DEFAULT_LINK_AFTER: DEFAULT_LINK_AFTER,
},
};

17
packages/code-generator/src/plugins/project/framework/icejs/index.ts Normal file
View File

@ -0,0 +1,17 @@
import template from './template';
import entry from './plugins/entry';
import entryHtml from './plugins/entryHtml';
import globalStyle from './plugins/globalStyle';
import packageJSON from './plugins/packageJSON';
import router from './plugins/router';
export default {
template,
plugins: {
entry,
entryHtml,
globalStyle,
packageJSON,
router,
},
};

2
packages/code-generator/src/postprocessor/prettier/index.ts
View File

@ -5,7 +5,7 @@ import { PostProcessor, PostProcessorFactory } from '../../types';
const PARSERS = ['css', 'scss', 'less', 'json', 'html', 'vue'];
interface ProcessorConfig {
type ProcessorConfig = {
customFileTypeParser: Record<string, string>;
}

31
packages/code-generator/src/publisher/disk/index.ts
View File

@ -1,21 +1,10 @@
import { CodeGeneratorError, IResultDir } from '../../types';
export type PublisherFactory<T, U> = (configuration?: Partial<T>) => U;
export interface IPublisher<T, U> {
publish: (options?: T) => Promise<IPublisherResponse<U>>;
getProject: () => IResultDir | void;
setProject: (project: IResultDir) => void;
}
export interface IPublisherFactoryParams {
project?: IResultDir;
}
export interface IPublisherResponse<T> {
success: boolean;
payload?: T;
}
import {
IResultDir,
PublisherFactory,
IPublisher,
IPublisherFactoryParams,
PublisherError,
} from '../../types';
import { writeFolder } from './utils';
export interface IDiskFactoryParams extends IPublisherFactoryParams {
@ -37,7 +26,7 @@ export const createDiskPublisher: PublisherFactory<
const getProject = (): IResultDir => {
if (!project) {
throw new CodeGeneratorError('Missing Project');
throw new PublisherError('Missing Project');
}
return project;
};
@ -55,7 +44,7 @@ export const createDiskPublisher: PublisherFactory<
const publish = async (options: IDiskFactoryParams = {}) => {
const projectToPublish = options.project || project;
if (!projectToPublish) {
throw new CodeGeneratorError('Missing Project');
throw new PublisherError('Missing Project');
}
const projectOutputPath = options.outputPath || outputPath;
@ -75,7 +64,7 @@ export const createDiskPublisher: PublisherFactory<
);
return { success: true, payload: projectOutputPath };
} catch (error) {
throw new CodeGeneratorError(error);
throw new PublisherError(error);
}
};

69
packages/code-generator/src/publisher/zip/index.ts Normal file
View File

@ -0,0 +1,69 @@
import {
IResultDir,
PublisherFactory,
IPublisher,
IPublisherFactoryParams,
PublisherError,
} from '../../types';
import { isNodeProcess, writeZipToDisk, generateProjectZip } from './utils'
// export type ZipBuffer = Buffer | Blob;
export type ZipBuffer = Buffer;
declare type ZipPublisherResponse = string | ZipBuffer;
export interface ZipFactoryParams extends IPublisherFactoryParams {
outputPath?: string;
projectSlug?: string;
}
export interface ZipPublisher extends IPublisher<ZipFactoryParams, ZipPublisherResponse> {
getOutputPath: () => string | undefined;
setOutputPath: (path: string) => void;
}
export const createZipPublisher: PublisherFactory<ZipFactoryParams, ZipPublisher> = (
params: ZipFactoryParams = {},
): ZipPublisher => {
let { project, outputPath } = params;
const getProject = () => project;
const setProject = (projectToSet: IResultDir) => {
project = projectToSet;
}
const getOutputPath = () => outputPath;
const setOutputPath = (path: string) => {
outputPath = path;
}
const publish = async (options: ZipFactoryParams = {}) => {
const projectToPublish = options.project || project;
if (!projectToPublish) {
throw new PublisherError('MissingProject');
}
const zipName = options.projectSlug || params.projectSlug || projectToPublish.name;
try {
const zipContent = await generateProjectZip(projectToPublish);
// If not output path is provided, zip is not written to disk
const projectOutputPath = options.outputPath || outputPath;
if (projectOutputPath && isNodeProcess()) {
await writeZipToDisk(projectOutputPath, zipContent, zipName);
}
return { success: true, payload: zipContent };
} catch (error) {
throw new PublisherError(error);
}
}
return {
publish,
getProject,
setProject,
getOutputPath,
setOutputPath,
};
}

60
packages/code-generator/src/publisher/zip/utils.ts Normal file
View File

@ -0,0 +1,60 @@
import JSZip from 'jszip';
import { IResultDir, IResultFile } from '../../types';
import { ZipBuffer } from './index';
export const isNodeProcess = (): boolean => {
return (
typeof process === 'object' &&
typeof process.versions === 'object' &&
typeof process.versions.node !== 'undefined'
);
}
export const writeZipToDisk = (
zipFolderPath: string,
content: ZipBuffer,
zipName: string,
): void => {
const fs = require('fs');
const path = require('path');
if (!fs.existsSync(zipFolderPath)) {
fs.mkdirSync(zipFolderPath, { recursive: true });
}
const zipPath = path.join(zipFolderPath, `${zipName}.zip`);
const writeStream = fs.createWriteStream(zipPath);
writeStream.write(content);
writeStream.end();
}
export const generateProjectZip = async (project: IResultDir): Promise<ZipBuffer> => {
let zip = new JSZip();
zip = writeFolderToZip(project, zip, true);
// const zipType = isNodeProcess() ? 'nodebuffer' : 'blob';
const zipType = 'nodebuffer'; // 目前先只支持 node 调用
return zip.generateAsync({ type: zipType });
}
const writeFolderToZip = (
folder: IResultDir,
parentFolder: JSZip,
ignoreFolder: boolean = false,
) => {
const zipFolder = ignoreFolder ? parentFolder : parentFolder.folder(folder.name);
if (zipFolder !== null) {
folder.files.forEach((file: IResultFile) => {
// const options = file.contentEncoding === 'base64' ? { base64: true } : {};
const options = {};
const fileName = file.ext ? `${file.name}.${file.ext}` : file.name;
zipFolder.file(fileName, file.content, options);
});
folder.dirs.forEach((subFolder: IResultDir) => {
writeFolderToZip(subFolder, zipFolder);
});
}
return parentFolder;
}

20
packages/code-generator/src/solutions/icejs.ts
View File

@ -12,20 +12,16 @@ import jsx from '../plugins/component/react/jsx';
import reactCommonDeps from '../plugins/component/react/reactCommonDeps';
import css from '../plugins/component/style/css';
import constants from '../plugins/project/constants';
import iceJsEntry from '../plugins/project/framework/icejs/plugins/entry';
import iceJsEntryHtml from '../plugins/project/framework/icejs/plugins/entryHtml';
import iceJsGlobalStyle from '../plugins/project/framework/icejs/plugins/globalStyle';
import iceJsPackageJSON from '../plugins/project/framework/icejs/plugins/packageJSON';
import iceJsRouter from '../plugins/project/framework/icejs/plugins/router';
import template from '../plugins/project/framework/icejs/template';
import i18n from '../plugins/project/i18n';
import utils from '../plugins/project/utils';
import icejs from '../plugins/project/framework/icejs';
import { prettier } from '../postprocessor';
export default function createIceJsProjectBuilder(): IProjectBuilder {
return createProjectBuilder({
template,
template: icejs.template,
plugins: {
components: [
reactCommonDeps(),
@ -53,14 +49,14 @@ export default function createIceJsProjectBuilder(): IProjectBuilder {
jsx(),
css(),
],
router: [esmodule(), iceJsRouter()],
entry: [iceJsEntry()],
router: [esmodule(), icejs.plugins.router()],
entry: [icejs.plugins.entry()],
constants: [constants()],
utils: [esmodule(), utils()],
i18n: [i18n()],
globalStyle: [iceJsGlobalStyle()],
htmlEntry: [iceJsEntryHtml()],
packageJSON: [iceJsPackageJSON()],
globalStyle: [icejs.plugins.globalStyle()],
htmlEntry: [icejs.plugins.entryHtml()],
packageJSON: [icejs.plugins.packageJSON()],
},
postProcessors: [prettier()],
});

7
packages/code-generator/src/types/error.ts
View File

@ -18,3 +18,10 @@ export class CompatibilityError extends CodeGeneratorError {
super(errorString);
}
}
// tslint:disable-next-line: max-classes-per-file
export class PublisherError extends CodeGeneratorError {
constructor(errorString: string) {
super(errorString);
}
}

1
packages/code-generator/src/types/index.ts
View File

@ -4,3 +4,4 @@ export * from './error';
export * from './result';
export * from './schema';
export * from './intermediate';
export * from './publisher';

19
packages/code-generator/src/types/publisher.ts Normal file
View File

@ -0,0 +1,19 @@
import {
IResultDir,
} from './index';
export type PublisherFactory<T, U> = (configuration?: Partial<T>) => U;
export interface IPublisher<T, U> {
publish: (options?: T) => Promise<IPublisherResponse<U>>;
getProject: () => IResultDir | void;
setProject: (project: IResultDir) => void;
}
export interface IPublisherFactoryParams {
project?: IResultDir;
}
export interface IPublisherResponse<T> {
success: boolean;
payload?: T;
}

4
packages/code-generator/src/utils/nodeToJSX.ts
View File

@ -96,8 +96,10 @@ export function generateReactCtrlLine(nodeItem: IComponentNodeItem): CodePiece[]
}
if (nodeItem.condition) {
const [isString, value] = generateCompositeType(nodeItem.condition);
pieces.unshift({
value: `(${generateCompositeType(nodeItem.condition)}) && (`,
value: `(${isString ? `'${value}'` : value}) && (`,
type: PIECE_TYPE.BEFORE,
});
pieces.push({