mirror of
https://github.com/alibaba/lowcode-engine.git
synced 2026-01-13 01:21:58 +00:00
Merge branch 'feat/merge-rax-generator' into refactor/merge-rax-generator
* feat/merge-rax-generator: (80 commits) fix: fix test result fix: miniAppBuildType config(temp) fix: miss scope refactor: 💡 support scope info & use middleware style plugin chore: 🤖 fix lint error feat: 🎸 数据源的类型默认是 fetch fix: 🐛 根据低代码规范,数据源的配置中isInit和 type 都是有默认值的,所以应该是可选的 feat: 🎸 与国凯的数据源引擎联调,对齐包名和导出方式 feat: 🎸 与国凯的数据源保持一致,将 urlParams 所需的 search 参数直接传入 feat: 🎸 按 826 对齐结论调整出码和数据源引擎 test: 💍 为 Rax 出码的各个测试用例的添加注释描述 chore: 🤖 recore 模板有问题,故暂且屏蔽掉 fix: 🐛 Rax 出码到小程序, 事件处理函数绑定 JSExpression 时也不应该包裹一个 eval, 小程序会报错 fix: 🐛 经验证发现小程序里面还是得包上 eval 否则 Rax 框架会误把 context 发送到渲染进程而出错 feat: 🎸 为 Rax 出码增加对 i18n 的支持 docs: ✏️ 根据春希的解释修改 generateAttr 中这块特殊处理的 feat: 🎸 globalStyle 支持定制样式文件的后缀名 docs: ✏️ 整理优化注释 docs: ✏️ 去掉一些意见处理了的 TODO docs: ✏️ 补充对 transformThis2Context 的说明 ...
This commit is contained in:
春希
commit
9f12b3c026
11
.vscode/launch.json
vendored
11
.vscode/launch.json
vendored
@ -10,6 +10,15 @@
|
||||
"request": "launch",
|
||||
"runtimeExecutable": "${workspaceFolder}/packages/material-parser/node_modules/.bin/ava",
|
||||
"runtimeArgs": ["debug", "--break", "${file}"]
|
||||
}
|
||||
},
|
||||
{
|
||||
"name": "ava code-gen",
|
||||
"type": "node",
|
||||
"request": "launch",
|
||||
"runtimeExecutable": "node",
|
||||
"runtimeArgs": ["${workspaceFolder}/node_modules/.bin/ava", "--serial", "${file}"],
|
||||
"cwd": "${workspaceFolder}/packages/code-generator",
|
||||
"outputCapture": "std"
|
||||
},
|
||||
]
|
||||
}
|
||||
|
||||
1
packages/code-generator/.eslintignore
Normal file
1
packages/code-generator/.eslintignore
Normal file
@ -0,0 +1 @@
|
||||
test-cases/
|
||||
@ -1,9 +1,31 @@
|
||||
# 出码模块
|
||||
|
||||
详细介绍看这里：<https://yuque.antfin-inc.com/docs/share/2b342641-6e01-4c77-b8e0-30421f55f69b>
|
||||
|
||||
## 安装接入
|
||||
|
||||
|
||||
## 自定义导出
|
||||
|
||||
|
||||
## 开始开发
|
||||
|
||||
本项目隶属于 [ali-lowcode-engine](http://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine), 需要和整个 [ali-lowcode-engine](http://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine) 一起开发。
|
||||
|
||||
所以先要初始化整个 [ali-lowcode-engine](http://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine) 的环境：
|
||||
|
||||
1. 克隆 [ali-lowcode-engine](http://gitlab.alibaba-inc.com/ali-lowcode/ali-lowcode-engine): `git clone git@gitlab.alibaba-inc.com:ali-lowcode/ali-lowcode-engine.git`
|
||||
2. 运行 `setup` 脚本，初始化环境： `npm run setup`
|
||||
|
||||
然后，因为本项目依赖 `@ali/lowcode-types` 所以需要先构建下 `type`，即执行: `lerna run build --scope @ali/lowcode-types`
|
||||
|
||||
最后，可以运行 `npm start` 命令启动本地调试（本项目通过 `ava` 进行单元测试，故 `start` 脚本其实就是 `watch` 模式的 `ava`):
|
||||
|
||||
```sh
|
||||
# 到本项目目录下执行：（推荐）
|
||||
npm start
|
||||
|
||||
# 或直接执行 ava：
|
||||
npx ava --watch
|
||||
|
||||
# 或在 ali-lowcode-engine 工程根目录下执行: (不推荐，因为命令太长而且没法响应输入)
|
||||
lerna run start --stream --scope @ali/lowcode-code-generator
|
||||
```
|
||||
|
||||
5
packages/code-generator/build.json
Normal file
5
packages/code-generator/build.json
Normal file
@ -0,0 +1,5 @@
|
||||
{
|
||||
"plugins": [
|
||||
"build-plugin-component"
|
||||
]
|
||||
}
|
||||
@ -91,6 +91,33 @@ function demo() {
|
||||
});
|
||||
}
|
||||
|
||||
function demo() {
|
||||
const schemaJson = fs.readFileSync('./demo/schema.json', { encoding: 'utf8' });
|
||||
const createIceJsProjectBuilder = CodeGenerator.solutions.icejs;
|
||||
const builder = createIceJsProjectBuilder();
|
||||
|
||||
const componentsMap = getComponentsMap();
|
||||
const root = JSON.parse(schemaJson);
|
||||
|
||||
const fullSchema = {
|
||||
version: '1.0.0',
|
||||
config: {
|
||||
historyMode: 'hash',
|
||||
targetRootID: 'J_Container',
|
||||
},
|
||||
meta: {
|
||||
name: 'demoproject',
|
||||
},
|
||||
componentsTree: [root],
|
||||
componentsMap,
|
||||
};
|
||||
|
||||
builder.generateProject(fullSchema).then((result) => {
|
||||
displayResultInConsole(result);
|
||||
return result;
|
||||
});
|
||||
}
|
||||
|
||||
function exportModule() {
|
||||
const schemaJson = fs.readFileSync('./demo/shenmaSample.json', { encoding: 'utf8' });
|
||||
const moduleBuilder = CodeGenerator.createModuleBuilder({
|
||||
|
||||
@ -3,18 +3,25 @@
|
||||
"version": "1.0.8-0",
|
||||
"description": "出码引擎 for LowCode Engine",
|
||||
"main": "lib/index.js",
|
||||
"module": "es/index.js",
|
||||
"typings": "es/index.d.ts",
|
||||
"files": [
|
||||
"lib",
|
||||
"es",
|
||||
"demo"
|
||||
],
|
||||
"scripts": {
|
||||
"build": "rimraf lib && tsc",
|
||||
"start": "ava --watch",
|
||||
"build": "npm run build:tsc",
|
||||
"build:bs": "rimraf lib && rimraf es && build-scripts build --skip-demo",
|
||||
"build:tsc": "rimraf lib && tsc",
|
||||
"demo": "node ./demo/demo.js",
|
||||
"test": "ava",
|
||||
"template": "node ./tools/createTemplate.js"
|
||||
},
|
||||
"dependencies": {
|
||||
"@ali/am-eslint-config": "*",
|
||||
"@ali/lowcode-types": "^0.8.14",
|
||||
"@ali/my-prettier": "^1.0.0",
|
||||
"@babel/generator": "^7.9.5",
|
||||
"@babel/parser": "^7.9.4",
|
||||
@ -24,24 +31,34 @@
|
||||
"change-case": "^3.1.0",
|
||||
"jszip": "^3.5.0",
|
||||
"prettier": "^2.0.2",
|
||||
"semver": "^7.3.2",
|
||||
"short-uuid": "^3.1.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@alib/build-scripts": "^0.1.18",
|
||||
"@types/babel__traverse": "^7.0.10",
|
||||
"ava": "^1.0.1",
|
||||
"rimraf": "^3.0.2",
|
||||
"ts-loader": "^6.2.2",
|
||||
"ts-node": "^7.0.1",
|
||||
"ts-node": "^8.10.2",
|
||||
"tsconfig-paths": "^3.9.0"
|
||||
},
|
||||
"ava": {
|
||||
"compileEnhancements": false,
|
||||
"snapshotDir": "test/fixtures/__snapshots__",
|
||||
"files": [
|
||||
"test/**/*.test.ts"
|
||||
],
|
||||
"extensions": [
|
||||
"ts"
|
||||
],
|
||||
"require": [
|
||||
"ts-node/register"
|
||||
"ts-node/register/transpile-only"
|
||||
],
|
||||
"sources": [
|
||||
"src/**/*",
|
||||
"test/**/*",
|
||||
"test-cases/**/expected/**/*"
|
||||
]
|
||||
},
|
||||
"publishConfig": {
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
export const COMMON_CHUNK_NAME = {
|
||||
ExternalDepsImport: 'CommonExternalDependencyImport',
|
||||
InternalDepsImport: 'CommonInternalDependencyImport',
|
||||
ImportAliasDefine: 'CommonImportAliasDefine',
|
||||
FileVarDefine: 'CommonFileScopeVarDefine',
|
||||
FileUtilDefine: 'CommonFileScopeMethodDefine',
|
||||
FileMainContent: 'CommonFileMainContent',
|
||||
@ -21,24 +22,29 @@ export const CLASS_DEFINE_CHUNK_NAME = {
|
||||
InsVar: 'CommonClassDefineInsVar',
|
||||
InsVarMethod: 'CommonClassDefineInsVarMethod',
|
||||
InsMethod: 'CommonClassDefineInsMethod',
|
||||
InsPrivateMethod: 'CommonClassDefineInsPrivateMethod',
|
||||
End: 'CommonClassDefineEnd',
|
||||
};
|
||||
|
||||
export const DEFAULT_LINK_AFTER = {
|
||||
[COMMON_CHUNK_NAME.ExternalDepsImport]: [],
|
||||
[COMMON_CHUNK_NAME.InternalDepsImport]: [COMMON_CHUNK_NAME.ExternalDepsImport],
|
||||
[COMMON_CHUNK_NAME.ImportAliasDefine]: [COMMON_CHUNK_NAME.ExternalDepsImport, COMMON_CHUNK_NAME.InternalDepsImport],
|
||||
[COMMON_CHUNK_NAME.FileVarDefine]: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
],
|
||||
[COMMON_CHUNK_NAME.FileUtilDefine]: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
],
|
||||
[CLASS_DEFINE_CHUNK_NAME.Start]: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
],
|
||||
@ -49,20 +55,13 @@ export const DEFAULT_LINK_AFTER = {
|
||||
CLASS_DEFINE_CHUNK_NAME.InsVar,
|
||||
CLASS_DEFINE_CHUNK_NAME.InsVarMethod,
|
||||
],
|
||||
[CLASS_DEFINE_CHUNK_NAME.ConstructorContent]: [
|
||||
CLASS_DEFINE_CHUNK_NAME.ConstructorStart,
|
||||
],
|
||||
[CLASS_DEFINE_CHUNK_NAME.ConstructorContent]: [CLASS_DEFINE_CHUNK_NAME.ConstructorStart],
|
||||
[CLASS_DEFINE_CHUNK_NAME.ConstructorEnd]: [
|
||||
CLASS_DEFINE_CHUNK_NAME.ConstructorStart,
|
||||
CLASS_DEFINE_CHUNK_NAME.ConstructorContent,
|
||||
],
|
||||
[CLASS_DEFINE_CHUNK_NAME.StaticVar]: [
|
||||
CLASS_DEFINE_CHUNK_NAME.Start,
|
||||
],
|
||||
[CLASS_DEFINE_CHUNK_NAME.StaticMethod]: [
|
||||
CLASS_DEFINE_CHUNK_NAME.Start,
|
||||
CLASS_DEFINE_CHUNK_NAME.StaticVar,
|
||||
],
|
||||
[CLASS_DEFINE_CHUNK_NAME.StaticVar]: [CLASS_DEFINE_CHUNK_NAME.Start],
|
||||
[CLASS_DEFINE_CHUNK_NAME.StaticMethod]: [CLASS_DEFINE_CHUNK_NAME.Start, CLASS_DEFINE_CHUNK_NAME.StaticVar],
|
||||
[CLASS_DEFINE_CHUNK_NAME.InsVar]: [
|
||||
CLASS_DEFINE_CHUNK_NAME.Start,
|
||||
CLASS_DEFINE_CHUNK_NAME.StaticVar,
|
||||
@ -82,7 +81,7 @@ export const DEFAULT_LINK_AFTER = {
|
||||
CLASS_DEFINE_CHUNK_NAME.InsVarMethod,
|
||||
CLASS_DEFINE_CHUNK_NAME.ConstructorEnd,
|
||||
],
|
||||
[CLASS_DEFINE_CHUNK_NAME.End]: [
|
||||
[CLASS_DEFINE_CHUNK_NAME.InsPrivateMethod]: [
|
||||
CLASS_DEFINE_CHUNK_NAME.Start,
|
||||
CLASS_DEFINE_CHUNK_NAME.StaticVar,
|
||||
CLASS_DEFINE_CHUNK_NAME.StaticMethod,
|
||||
@ -91,9 +90,20 @@ export const DEFAULT_LINK_AFTER = {
|
||||
CLASS_DEFINE_CHUNK_NAME.InsMethod,
|
||||
CLASS_DEFINE_CHUNK_NAME.ConstructorEnd,
|
||||
],
|
||||
[CLASS_DEFINE_CHUNK_NAME.End]: [
|
||||
CLASS_DEFINE_CHUNK_NAME.Start,
|
||||
CLASS_DEFINE_CHUNK_NAME.StaticVar,
|
||||
CLASS_DEFINE_CHUNK_NAME.StaticMethod,
|
||||
CLASS_DEFINE_CHUNK_NAME.InsVar,
|
||||
CLASS_DEFINE_CHUNK_NAME.InsVarMethod,
|
||||
CLASS_DEFINE_CHUNK_NAME.InsMethod,
|
||||
CLASS_DEFINE_CHUNK_NAME.InsPrivateMethod,
|
||||
CLASS_DEFINE_CHUNK_NAME.ConstructorEnd,
|
||||
],
|
||||
[COMMON_CHUNK_NAME.FileMainContent]: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
CLASS_DEFINE_CHUNK_NAME.End,
|
||||
@ -101,6 +111,7 @@ export const DEFAULT_LINK_AFTER = {
|
||||
[COMMON_CHUNK_NAME.FileExport]: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
CLASS_DEFINE_CHUNK_NAME.End,
|
||||
@ -109,6 +120,6 @@ export const DEFAULT_LINK_AFTER = {
|
||||
[COMMON_CHUNK_NAME.StyleDepsImport]: [],
|
||||
[COMMON_CHUNK_NAME.StyleCssContent]: [COMMON_CHUNK_NAME.StyleDepsImport],
|
||||
[COMMON_CHUNK_NAME.HtmlContent]: [],
|
||||
}
|
||||
};
|
||||
|
||||
export const COMMON_SUB_MODULE_NAME = 'index';
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
export const NATIVE_ELE_PKG: string = 'native';
|
||||
export const NATIVE_ELE_PKG = 'native';
|
||||
|
||||
export const CONTAINER_TYPE = {
|
||||
COMPONENT: 'Component',
|
||||
|
||||
@ -1,11 +1,4 @@
|
||||
import {
|
||||
ChunkContent,
|
||||
ChunkType,
|
||||
CodeGeneratorError,
|
||||
CodeGeneratorFunction,
|
||||
ICodeBuilder,
|
||||
ICodeChunk,
|
||||
} from '../types';
|
||||
import { ChunkContent, ChunkType, CodeGeneratorError, CodeGeneratorFunction, ICodeBuilder, ICodeChunk } from '../types';
|
||||
|
||||
export default class Builder implements ICodeBuilder {
|
||||
private chunkDefinitions: ICodeChunk[] = [];
|
||||
@ -23,13 +16,13 @@ export default class Builder implements ICodeBuilder {
|
||||
* Links all chunks together based on their requirements. Returns an array
|
||||
* of ordered chunk names which need to be compiled and glued together.
|
||||
*/
|
||||
public link(chunkDefinitions: ICodeChunk[] = []): string {
|
||||
link(chunkDefinitions: ICodeChunk[] = []): string {
|
||||
const chunks = chunkDefinitions || this.chunkDefinitions;
|
||||
if (chunks.length <= 0) {
|
||||
return '';
|
||||
}
|
||||
|
||||
const unprocessedChunks = chunks.map(chunk => {
|
||||
const unprocessedChunks = chunks.map((chunk) => {
|
||||
return {
|
||||
name: chunk.name,
|
||||
type: chunk.type,
|
||||
@ -50,9 +43,7 @@ export default class Builder implements ICodeBuilder {
|
||||
}
|
||||
|
||||
if (unprocessedChunks[indexToRemove].linkAfter.length > 0) {
|
||||
throw new CodeGeneratorError(
|
||||
'Operation aborted. Reason: cyclic dependency between chunks.',
|
||||
);
|
||||
throw new CodeGeneratorError('Operation aborted. Reason: cyclic dependency between chunks.');
|
||||
}
|
||||
|
||||
const { type, content, name } = unprocessedChunks[indexToRemove];
|
||||
@ -62,10 +53,10 @@ export default class Builder implements ICodeBuilder {
|
||||
}
|
||||
|
||||
unprocessedChunks.splice(indexToRemove, 1);
|
||||
if (!unprocessedChunks.some(ch => ch.name === name)) {
|
||||
if (!unprocessedChunks.some((ch) => ch.name === name)) {
|
||||
unprocessedChunks.forEach(
|
||||
// remove the processed chunk from all the linkAfter arrays from the remaining chunks
|
||||
ch => (ch.linkAfter = ch.linkAfter.filter(after => after !== name)),
|
||||
(ch) => (ch.linkAfter = ch.linkAfter.filter((after) => after !== name)),
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -73,14 +64,12 @@ export default class Builder implements ICodeBuilder {
|
||||
return resultingString.join('\n');
|
||||
}
|
||||
|
||||
public generateByType(type: string, content: unknown): string {
|
||||
generateByType(type: string, content: unknown): string {
|
||||
if (!content) {
|
||||
return '';
|
||||
}
|
||||
if (Array.isArray(content)) {
|
||||
return content
|
||||
.map(contentItem => this.generateByType(type, contentItem))
|
||||
.join('\n');
|
||||
return content.map((contentItem) => this.generateByType(type, contentItem)).join('\n');
|
||||
}
|
||||
|
||||
if (!this.generators[type]) {
|
||||
@ -95,8 +84,6 @@ export default class Builder implements ICodeBuilder {
|
||||
// remove invalid chunks (which did not end up being created) from the linkAfter fields
|
||||
// one use-case is when you want to remove the import plugin
|
||||
private cleanupInvalidChunks(linkAfter: string[], chunks: ICodeChunk[]) {
|
||||
return linkAfter.filter(chunkName =>
|
||||
chunks.some(chunk => chunk.name === chunkName),
|
||||
);
|
||||
return linkAfter.filter((chunkName) => chunks.some((chunk) => chunk.name === chunkName));
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,13 +1,12 @@
|
||||
import { ProjectSchema, ResultFile, ResultDir } from '@ali/lowcode-types';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
CodeGeneratorError,
|
||||
IBasicSchema,
|
||||
ICodeChunk,
|
||||
ICompiledModule,
|
||||
IModuleBuilder,
|
||||
IParseResult,
|
||||
IResultDir,
|
||||
IResultFile,
|
||||
ISchemaParser,
|
||||
PostProcessor,
|
||||
} from '../types';
|
||||
@ -17,9 +16,7 @@ import { COMMON_SUB_MODULE_NAME } from '../const/generator';
|
||||
import SchemaParser from '../parser/SchemaParser';
|
||||
import ChunkBuilder from './ChunkBuilder';
|
||||
import CodeBuilder from './CodeBuilder';
|
||||
|
||||
import ResultDir from '../model/ResultDir';
|
||||
import ResultFile from '../model/ResultFile';
|
||||
import { createResultFile, createResultDir, addFile } from '../utils/resultHelper';
|
||||
|
||||
export function createModuleBuilder(
|
||||
options: {
|
||||
@ -40,12 +37,12 @@ export function createModuleBuilder(
|
||||
throw new CodeGeneratorError('No plugins found. Component generation cannot work without any plugins!');
|
||||
}
|
||||
|
||||
let files: IResultFile[] = [];
|
||||
let files: ResultFile[] = [];
|
||||
|
||||
const { chunks } = await chunkGenerator.run(input);
|
||||
chunks.forEach((fileChunkList) => {
|
||||
const content = linker.link(fileChunkList);
|
||||
const file = new ResultFile(fileChunkList[0].subModule || moduleMainName, fileChunkList[0].fileType, content);
|
||||
const file = createResultFile(fileChunkList[0].subModule || moduleMainName, fileChunkList[0].fileType, content);
|
||||
files.push(file);
|
||||
});
|
||||
|
||||
@ -57,7 +54,7 @@ export function createModuleBuilder(
|
||||
content = processer(content, type);
|
||||
});
|
||||
|
||||
return new ResultFile(file.name, type, content);
|
||||
return createResultFile(file.name, type, content);
|
||||
});
|
||||
}
|
||||
|
||||
@ -66,7 +63,7 @@ export function createModuleBuilder(
|
||||
};
|
||||
};
|
||||
|
||||
const generateModuleCode = async (schema: IBasicSchema | string): Promise<IResultDir> => {
|
||||
const generateModuleCode = async (schema: ProjectSchema | string): Promise<ResultDir> => {
|
||||
// Init
|
||||
const schemaParser: ISchemaParser = new SchemaParser();
|
||||
const parseResult: IParseResult = schemaParser.parse(schema);
|
||||
@ -74,19 +71,19 @@ export function createModuleBuilder(
|
||||
const containerInfo = parseResult.containers[0];
|
||||
const { files } = await generateModule(containerInfo);
|
||||
|
||||
const dir = new ResultDir(containerInfo.moduleName);
|
||||
files.forEach((file) => dir.addFile(file));
|
||||
const dir = createResultDir(containerInfo.moduleName);
|
||||
files.forEach((file) => addFile(dir, file));
|
||||
|
||||
return dir;
|
||||
};
|
||||
|
||||
const linkCodeChunks = (chunks: Record<string, ICodeChunk[]>, fileName: string) => {
|
||||
const files: IResultFile[] = [];
|
||||
const files: ResultFile[] = [];
|
||||
|
||||
Object.keys(chunks).forEach((fileKey) => {
|
||||
const fileChunkList = chunks[fileKey];
|
||||
const content = linker.link(fileChunkList);
|
||||
const file = new ResultFile(fileChunkList[0].subModule || fileName, fileChunkList[0].fileType, content);
|
||||
const file = createResultFile(fileChunkList[0].subModule || fileName, fileChunkList[0].fileType, content);
|
||||
files.push(file);
|
||||
});
|
||||
|
||||
|
||||
@ -1,36 +1,35 @@
|
||||
import { ResultDir, ResultFile, ProjectSchema } from '@ali/lowcode-types';
|
||||
|
||||
import {
|
||||
IModuleBuilder,
|
||||
IParseResult,
|
||||
IProjectBuilder,
|
||||
IProjectPlugins,
|
||||
IProjectSchema,
|
||||
IProjectTemplate,
|
||||
IResultDir,
|
||||
IResultFile,
|
||||
ISchemaParser,
|
||||
PostProcessor,
|
||||
} from '../types';
|
||||
|
||||
import ResultDir from '../model/ResultDir';
|
||||
import SchemaParser from '../parser/SchemaParser';
|
||||
import { createResultDir, addDirectory, addFile } from '../utils/resultHelper';
|
||||
|
||||
import { createModuleBuilder } from '../generator/ModuleBuilder';
|
||||
|
||||
interface IModuleInfo {
|
||||
moduleName?: string;
|
||||
path: string[];
|
||||
files: IResultFile[];
|
||||
files: ResultFile[];
|
||||
}
|
||||
|
||||
function getDirFromRoot(root: IResultDir, path: string[]): IResultDir {
|
||||
let current: IResultDir = root;
|
||||
function getDirFromRoot(root: ResultDir, path: string[]): ResultDir {
|
||||
let current: ResultDir = root;
|
||||
path.forEach((p) => {
|
||||
const exist = current.dirs.find((d) => d.name === p);
|
||||
if (exist) {
|
||||
current = exist;
|
||||
} else {
|
||||
const newDir = new ResultDir(p);
|
||||
current.addDirectory(newDir);
|
||||
const newDir = createResultDir(p);
|
||||
addDirectory(current, newDir);
|
||||
current = newDir;
|
||||
}
|
||||
});
|
||||
@ -57,7 +56,7 @@ export class ProjectBuilder implements IProjectBuilder {
|
||||
this.postProcessors = postProcessors;
|
||||
}
|
||||
|
||||
async generateProject(schema: IProjectSchema | string): Promise<IResultDir> {
|
||||
async generateProject(schema: ProjectSchema | string): Promise<ResultDir> {
|
||||
// Init
|
||||
const schemaParser: ISchemaParser = new SchemaParser();
|
||||
const builders = this.createModuleBuilders();
|
||||
@ -117,6 +116,27 @@ export class ProjectBuilder implements IProjectBuilder {
|
||||
files,
|
||||
});
|
||||
}
|
||||
|
||||
// appConfig
|
||||
if (builders.appConfig) {
|
||||
const { files } = await builders.appConfig.generateModule(parseResult);
|
||||
|
||||
buildResult.push({
|
||||
path: this.template.slots.appConfig.path,
|
||||
files,
|
||||
});
|
||||
}
|
||||
|
||||
// buildConfig
|
||||
if (builders.buildConfig) {
|
||||
const { files } = await builders.buildConfig.generateModule(parseResult);
|
||||
|
||||
buildResult.push({
|
||||
path: this.template.slots.buildConfig.path,
|
||||
files,
|
||||
});
|
||||
}
|
||||
|
||||
// constants?
|
||||
if (parseResult.project && builders.constants && this.template.slots.constants) {
|
||||
const { files } = await builders.constants.generateModule(parseResult.project);
|
||||
@ -126,6 +146,7 @@ export class ProjectBuilder implements IProjectBuilder {
|
||||
files,
|
||||
});
|
||||
}
|
||||
|
||||
// utils?
|
||||
if (parseResult.globalUtils && builders.utils && this.template.slots.utils) {
|
||||
const { files } = await builders.utils.generateModule(parseResult.globalUtils);
|
||||
@ -135,15 +156,17 @@ export class ProjectBuilder implements IProjectBuilder {
|
||||
files,
|
||||
});
|
||||
}
|
||||
|
||||
// i18n?
|
||||
if (parseResult.globalI18n && builders.i18n && this.template.slots.i18n) {
|
||||
const { files } = await builders.i18n.generateModule(parseResult.globalI18n);
|
||||
if (builders.i18n && this.template.slots.i18n) {
|
||||
const { files } = await builders.i18n.generateModule(parseResult.project);
|
||||
|
||||
buildResult.push({
|
||||
path: this.template.slots.i18n.path,
|
||||
files,
|
||||
});
|
||||
}
|
||||
|
||||
// globalStyle
|
||||
if (parseResult.project && builders.globalStyle) {
|
||||
const { files } = await builders.globalStyle.generateModule(parseResult.project);
|
||||
@ -153,6 +176,7 @@ export class ProjectBuilder implements IProjectBuilder {
|
||||
files,
|
||||
});
|
||||
}
|
||||
|
||||
// htmlEntry
|
||||
if (parseResult.project && builders.htmlEntry) {
|
||||
const { files } = await builders.htmlEntry.generateModule(parseResult.project);
|
||||
@ -162,6 +186,7 @@ export class ProjectBuilder implements IProjectBuilder {
|
||||
files,
|
||||
});
|
||||
}
|
||||
|
||||
// packageJSON
|
||||
if (parseResult.project && builders.packageJSON) {
|
||||
const { files } = await builders.packageJSON.generateModule(parseResult.project);
|
||||
@ -172,17 +197,19 @@ export class ProjectBuilder implements IProjectBuilder {
|
||||
});
|
||||
}
|
||||
|
||||
// TODO: 更多 slots 的处理？？是不是可以考虑把 template 中所有的 slots 都处理下？
|
||||
|
||||
// Post Process
|
||||
|
||||
// Combine Modules
|
||||
buildResult.forEach((moduleInfo) => {
|
||||
let targetDir = getDirFromRoot(projectRoot, moduleInfo.path);
|
||||
if (moduleInfo.moduleName) {
|
||||
const dir = new ResultDir(moduleInfo.moduleName);
|
||||
targetDir.addDirectory(dir);
|
||||
const dir = createResultDir(moduleInfo.moduleName);
|
||||
addDirectory(targetDir, dir);
|
||||
targetDir = dir;
|
||||
}
|
||||
moduleInfo.files.forEach((file) => targetDir.addFile(file));
|
||||
moduleInfo.files.forEach((file) => addFile(targetDir, file));
|
||||
});
|
||||
|
||||
return projectRoot;
|
||||
|
||||
@ -7,7 +7,8 @@ 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 createRecoreProjectBuilder from './solutions/recore';
|
||||
import createRaxAppProjectBuilder from './solutions/rax-app';
|
||||
|
||||
// 引入说明
|
||||
import { REACT_CHUNK_NAME } from './plugins/component/react/const';
|
||||
@ -34,11 +35,15 @@ import prettier from './postprocessor/prettier';
|
||||
import * as utilsCommon from './utils/common';
|
||||
import * as utilsCompositeType from './utils/compositeType';
|
||||
import * as utilsJsExpression from './utils/jsExpression';
|
||||
import * as utilsJsSlot from './utils/jsSlot';
|
||||
import * as utilsNodeToJSX from './utils/nodeToJSX';
|
||||
import * as utilsResultHelper from './utils/resultHelper';
|
||||
import * as utilsTemplateHelper from './utils/templateHelper';
|
||||
import * as utilsValidate from './utils/validate';
|
||||
|
||||
// 引入内置解决方案模块
|
||||
import icejs from './plugins/project/framework/icejs';
|
||||
import rax from './plugins/project/framework/rax';
|
||||
|
||||
export * from './types';
|
||||
|
||||
@ -47,10 +52,12 @@ export default {
|
||||
createModuleBuilder,
|
||||
solutions: {
|
||||
icejs: createIceJsProjectBuilder,
|
||||
recore: createRecoreProjectBuilder,
|
||||
// recore: createRecoreProjectBuilder,
|
||||
rax: createRaxAppProjectBuilder,
|
||||
},
|
||||
solutionParts: {
|
||||
icejs,
|
||||
rax,
|
||||
},
|
||||
publishers: {
|
||||
disk: createDiskPublisher,
|
||||
@ -87,8 +94,11 @@ export default {
|
||||
common: utilsCommon,
|
||||
compositeType: utilsCompositeType,
|
||||
jsExpression: utilsJsExpression,
|
||||
jsSlot: utilsJsSlot,
|
||||
nodeToJSX: utilsNodeToJSX,
|
||||
resultHelper: utilsResultHelper,
|
||||
templateHelper: utilsTemplateHelper,
|
||||
validate: utilsValidate,
|
||||
},
|
||||
chunkNames: {
|
||||
COMMON_CHUNK_NAME,
|
||||
|
||||
@ -1,31 +0,0 @@
|
||||
import { CodeGeneratorError, IResultDir, IResultFile } from '../types';
|
||||
|
||||
export default class ResultDir implements IResultDir {
|
||||
public name: string;
|
||||
public dirs: IResultDir[];
|
||||
public files: IResultFile[];
|
||||
|
||||
constructor(name: string) {
|
||||
this.name = name;
|
||||
this.dirs = [];
|
||||
this.files = [];
|
||||
}
|
||||
|
||||
public addDirectory(dir: IResultDir): void {
|
||||
if (this.dirs.findIndex(d => d.name === dir.name) < 0) {
|
||||
this.dirs.push(dir);
|
||||
} else {
|
||||
throw new CodeGeneratorError('Adding same directory to one directory');
|
||||
}
|
||||
}
|
||||
|
||||
public addFile(file: IResultFile): void {
|
||||
if (
|
||||
this.files.findIndex(f => f.name === file.name && f.ext === file.ext) < 0
|
||||
) {
|
||||
this.files.push(file);
|
||||
} else {
|
||||
throw new CodeGeneratorError('Adding same file to one directory');
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,13 +0,0 @@
|
||||
import { IResultFile } from '../types';
|
||||
|
||||
export default class ResultFile implements IResultFile {
|
||||
public name: string;
|
||||
public ext: string;
|
||||
public content: string;
|
||||
|
||||
constructor(name: string, ext: string = 'jsx', content: string = '') {
|
||||
this.name = name;
|
||||
this.ext = ext;
|
||||
this.content = content;
|
||||
}
|
||||
}
|
||||
@ -2,30 +2,28 @@
|
||||
* 解析器是对输入的固定格式数据做拆解，使其符合引擎后续步骤预期，完成统一处理逻辑的步骤。
|
||||
* 本解析器面向的是标准 schema 协议。
|
||||
*/
|
||||
import changeCase from 'change-case';
|
||||
import { UtilItem, NodeDataType, NodeSchema, ContainerSchema, ProjectSchema, PropsMap } from '@ali/lowcode-types';
|
||||
import { IPageMeta } from '../types';
|
||||
|
||||
import { SUPPORT_SCHEMA_VERSION_LIST } from '../const';
|
||||
|
||||
import { handleSubNodes } from '../utils/nodeToJSX';
|
||||
import { handleSubNodes } from '../utils/schema';
|
||||
import { uniqueArray } from '../utils/common';
|
||||
|
||||
import {
|
||||
ChildNodeType,
|
||||
CodeGeneratorError,
|
||||
CompatibilityError,
|
||||
DependencyType,
|
||||
IBasicSchema,
|
||||
IComponentNodeItem,
|
||||
IContainerInfo,
|
||||
IContainerNodeItem,
|
||||
IDependency,
|
||||
IExternalDependency,
|
||||
IInternalDependency,
|
||||
InternalDependencyType,
|
||||
IPageMeta,
|
||||
IParseResult,
|
||||
IProjectSchema,
|
||||
ISchemaParser,
|
||||
IUtilItem,
|
||||
INpmPackage,
|
||||
IRouterInfo,
|
||||
} from '../types';
|
||||
|
||||
const defaultContainer: IContainerInfo = {
|
||||
@ -38,7 +36,7 @@ const defaultContainer: IContainerInfo = {
|
||||
};
|
||||
|
||||
class SchemaParser implements ISchemaParser {
|
||||
validate(schema: IBasicSchema): boolean {
|
||||
validate(schema: ProjectSchema): boolean {
|
||||
if (SUPPORT_SCHEMA_VERSION_LIST.indexOf(schema.version) < 0) {
|
||||
throw new CompatibilityError(`Not support schema with version [${schema.version}]`);
|
||||
}
|
||||
@ -46,13 +44,13 @@ class SchemaParser implements ISchemaParser {
|
||||
return true;
|
||||
}
|
||||
|
||||
parse(schemaSrc: IProjectSchema | string): IParseResult {
|
||||
parse(schemaSrc: ProjectSchema | string): IParseResult {
|
||||
// TODO: collect utils depends in JSExpression
|
||||
const compDeps: Record<string, IExternalDependency> = {};
|
||||
const internalDeps: Record<string, IInternalDependency> = {};
|
||||
let utilsDeps: IExternalDependency[] = [];
|
||||
|
||||
let schema: IProjectSchema;
|
||||
let schema: ProjectSchema;
|
||||
if (typeof schemaSrc === 'string') {
|
||||
try {
|
||||
schema = JSON.parse(schemaSrc);
|
||||
@ -65,31 +63,38 @@ class SchemaParser implements ISchemaParser {
|
||||
|
||||
// 解析三方组件依赖
|
||||
schema.componentsMap.forEach((info) => {
|
||||
info.dependencyType = DependencyType.External;
|
||||
info.importName = info.componentName;
|
||||
compDeps[info.componentName] = info;
|
||||
if (info.componentName) {
|
||||
compDeps[info.componentName] = {
|
||||
...info,
|
||||
dependencyType: DependencyType.External,
|
||||
componentName: info.componentName,
|
||||
exportName: info.exportName ?? info.componentName,
|
||||
version: info.version || '*',
|
||||
destructuring: info.destructuring ?? false,
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
let containers: IContainerInfo[];
|
||||
// Test if this is a lowcode component without container
|
||||
if (schema.componentsTree.length > 0) {
|
||||
const firstRoot: IContainerNodeItem = schema.componentsTree[0] as IContainerNodeItem;
|
||||
const firstRoot: ContainerSchema = schema.componentsTree[0] as ContainerSchema;
|
||||
|
||||
if (!firstRoot.fileName) {
|
||||
if (!('fileName' in firstRoot) || !firstRoot.fileName) {
|
||||
// 整个 schema 描述一个容器，且无根节点定义
|
||||
const container: IContainerInfo = {
|
||||
...defaultContainer,
|
||||
children: schema.componentsTree as IComponentNodeItem[],
|
||||
children: schema.componentsTree as NodeSchema[],
|
||||
};
|
||||
containers = [container];
|
||||
} else {
|
||||
// 普通带 1 到多个容器的 schema
|
||||
containers = schema.componentsTree.map((n) => {
|
||||
const subRoot = n as IContainerNodeItem;
|
||||
const subRoot = n as ContainerSchema;
|
||||
const container: IContainerInfo = {
|
||||
...subRoot,
|
||||
containerType: subRoot.componentName,
|
||||
moduleName: subRoot.fileName, // TODO: 驼峰化名称
|
||||
moduleName: changeCase.pascalCase(subRoot.fileName),
|
||||
};
|
||||
return container;
|
||||
});
|
||||
@ -124,6 +129,7 @@ class SchemaParser implements ISchemaParser {
|
||||
internalDeps[dep.moduleName] = dep;
|
||||
});
|
||||
|
||||
const containersDeps = ([] as IDependency[]).concat(...containers.map((c) => c.deps || []));
|
||||
// TODO: 不应该在出码部分解决？
|
||||
// 处理 children 写在了 props 里的情况
|
||||
containers.forEach((container) => {
|
||||
@ -131,11 +137,18 @@ class SchemaParser implements ISchemaParser {
|
||||
handleSubNodes<string>(
|
||||
container.children,
|
||||
{
|
||||
node: (i: IComponentNodeItem) => {
|
||||
if (i.props && i.props.children && !i.children) {
|
||||
i.children = i.props.children as ChildNodeType;
|
||||
node: (i: NodeSchema) => {
|
||||
if (i.props) {
|
||||
if (Array.isArray(i.props)) {
|
||||
// FIXME: is array type props description
|
||||
} else {
|
||||
const nodeProps = i.props as PropsMap;
|
||||
if (nodeProps.children && !i.children) {
|
||||
i.children = nodeProps.children as NodeDataType;
|
||||
}
|
||||
}
|
||||
}
|
||||
return [''];
|
||||
return '';
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -157,18 +170,21 @@ class SchemaParser implements ISchemaParser {
|
||||
});
|
||||
|
||||
// 分析路由配置
|
||||
const routes = containers
|
||||
const routes: IRouterInfo['routes'] = containers
|
||||
.filter((container) => container.containerType === 'Page')
|
||||
.map((page) => {
|
||||
const meta = page.meta as IPageMeta;
|
||||
const meta = page.meta;
|
||||
if (meta) {
|
||||
return {
|
||||
path: meta.router,
|
||||
path: (meta as IPageMeta).router || `/${page.fileName}`, // 如果无法找到页面路由信息，则用 fileName 做兜底
|
||||
fileName: page.fileName,
|
||||
componentName: page.moduleName,
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
path: '',
|
||||
fileName: page.fileName,
|
||||
componentName: page.moduleName,
|
||||
};
|
||||
});
|
||||
@ -178,7 +194,7 @@ class SchemaParser implements ISchemaParser {
|
||||
.filter((dep) => !!dep);
|
||||
|
||||
// 分析 Utils 依赖
|
||||
let utils: IUtilItem[];
|
||||
let utils: UtilItem[];
|
||||
if (schema.utils) {
|
||||
utils = schema.utils;
|
||||
utilsDeps = schema.utils.filter((u) => u.type !== 'function').map((u) => u.content as IExternalDependency);
|
||||
@ -192,7 +208,13 @@ class SchemaParser implements ISchemaParser {
|
||||
const p = (con.deps || [])
|
||||
.map((dep) => (dep.dependencyType === DependencyType.External ? dep : null))
|
||||
.filter((dep) => dep !== null);
|
||||
npms.push(...((p as unknown) as INpmPackage[]));
|
||||
const npmInfos: INpmPackage[] = p
|
||||
.filter((i) => Boolean(i))
|
||||
.map((i) => ({
|
||||
package: (i as IExternalDependency).package,
|
||||
version: (i as IExternalDependency).version,
|
||||
}));
|
||||
npms.push(...npmInfos);
|
||||
});
|
||||
npms = uniqueArray<INpmPackage>(npms, (i) => i.package);
|
||||
|
||||
@ -208,21 +230,23 @@ class SchemaParser implements ISchemaParser {
|
||||
deps: routerDeps,
|
||||
},
|
||||
project: {
|
||||
meta: schema.meta,
|
||||
config: schema.config,
|
||||
css: schema.css,
|
||||
constants: schema.constants,
|
||||
config: schema.config || {},
|
||||
meta: schema.meta || {},
|
||||
i18n: schema.i18n,
|
||||
containersDeps,
|
||||
utilsDeps,
|
||||
packages: npms,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
getComponentNames(children: ChildNodeType): string[] {
|
||||
getComponentNames(children: NodeDataType): string[] {
|
||||
return handleSubNodes<string>(
|
||||
children,
|
||||
{
|
||||
node: (i: IComponentNodeItem) => [i.componentName],
|
||||
node: (i: NodeSchema) => i.componentName,
|
||||
},
|
||||
{
|
||||
rerun: true,
|
||||
|
||||
@ -28,29 +28,29 @@ function groupDepsByPack(deps: IDependency[]): Record<string, IDependency[]> {
|
||||
};
|
||||
|
||||
// TODO: main 这个信息到底怎么用，是不是外部包不需要使用？
|
||||
// deps.forEach(dep => {
|
||||
// if (dep.dependencyType === DependencyType.Internal) {
|
||||
// addDep(
|
||||
// `${(dep as IInternalDependency).moduleName}${`/${dep.main}` || ''}`,
|
||||
// dep,
|
||||
// );
|
||||
// } else {
|
||||
// addDep(`${(dep as IExternalDependency).package}${`/${dep.main}` || ''}`, dep);
|
||||
// }
|
||||
// });
|
||||
|
||||
const depMainBlackList = ['lib', 'lib/index', 'es', 'es/index', 'main'];
|
||||
deps.forEach((dep) => {
|
||||
if (dep.dependencyType === DependencyType.Internal) {
|
||||
addDep(`${(dep as IInternalDependency).moduleName}`, dep);
|
||||
addDep(`${(dep as IInternalDependency).moduleName}${dep.main ? `/${dep.main}` : ''}`, dep);
|
||||
} else {
|
||||
addDep(`${(dep as IExternalDependency).package}`, dep);
|
||||
let depMain = '';
|
||||
// TODO: 部分类型的 main 暂时认为没用
|
||||
if (dep.main && depMainBlackList.indexOf(dep.main) < 0) {
|
||||
depMain = dep.main;
|
||||
}
|
||||
addDep(`${(dep as IExternalDependency).package}${depMain ? `/${depMain}` : ''}`, dep);
|
||||
}
|
||||
});
|
||||
|
||||
return depMap;
|
||||
}
|
||||
|
||||
function buildPackageImport(pkg: string, deps: IDependency[], targetFileType: string): ICodeChunk[] {
|
||||
function buildPackageImport(
|
||||
pkg: string,
|
||||
deps: IDependency[],
|
||||
targetFileType: string,
|
||||
useAliasName: boolean,
|
||||
): ICodeChunk[] {
|
||||
const chunks: ICodeChunk[] = [];
|
||||
let defaultImport = '';
|
||||
let defaultImportAs = '';
|
||||
@ -58,8 +58,9 @@ function buildPackageImport(pkg: string, deps: IDependency[], targetFileType: st
|
||||
|
||||
deps.forEach((dep) => {
|
||||
const srcName = dep.exportName;
|
||||
let targetName = dep.importName || dep.exportName;
|
||||
let targetName = dep.componentName || dep.exportName;
|
||||
|
||||
// 如果是自组件，则导出父组件，并且根据自组件命名规则，判断是否需要定义标识符
|
||||
if (dep.subName) {
|
||||
if (targetName !== `${srcName}.${dep.subName}`) {
|
||||
if (!isValidIdentifier(targetName)) {
|
||||
@ -69,9 +70,14 @@ function buildPackageImport(pkg: string, deps: IDependency[], targetFileType: st
|
||||
chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: targetFileType,
|
||||
name: COMMON_CHUNK_NAME.FileVarDefine,
|
||||
name: COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
content: `const ${targetName} = ${srcName}.${dep.subName};`,
|
||||
linkAfter: [COMMON_CHUNK_NAME.ExternalDepsImport, COMMON_CHUNK_NAME.InternalDepsImport],
|
||||
ext: {
|
||||
originalName: `${srcName}.${dep.subName}`,
|
||||
aliasName: targetName,
|
||||
dependency: dep,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
@ -86,13 +92,30 @@ function buildPackageImport(pkg: string, deps: IDependency[], targetFileType: st
|
||||
defaultImport = srcName;
|
||||
defaultImportAs = targetName;
|
||||
}
|
||||
|
||||
if (targetName !== srcName) {
|
||||
chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: targetFileType,
|
||||
name: COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
content: '',
|
||||
linkAfter: [COMMON_CHUNK_NAME.ExternalDepsImport, COMMON_CHUNK_NAME.InternalDepsImport],
|
||||
ext: {
|
||||
originalName: srcName,
|
||||
aliasName: targetName,
|
||||
dependency: dep,
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
const items = Object.keys(imports).map((src) => (src === imports[src] ? src : `${src} as ${imports[src]}`));
|
||||
const items = Object.keys(imports).map((src) =>
|
||||
src === imports[src] || !useAliasName ? src : `${src} as ${imports[src]}`,
|
||||
);
|
||||
|
||||
const statementL = ['import'];
|
||||
if (defaultImport) {
|
||||
statementL.push(defaultImportAs);
|
||||
statementL.push(useAliasName ? defaultImportAs : defaultImport);
|
||||
if (items.length > 0) {
|
||||
statementL.push(',');
|
||||
}
|
||||
@ -127,13 +150,15 @@ function buildPackageImport(pkg: string, deps: IDependency[], targetFileType: st
|
||||
}
|
||||
|
||||
type PluginConfig = {
|
||||
fileType: string;
|
||||
fileType?: string; // 导出的文件类型
|
||||
useAliasName?: boolean; // 是否使用 componentName 重命名组件 identifier
|
||||
};
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?: PluginConfig) => {
|
||||
const cfg: PluginConfig = {
|
||||
const cfg = {
|
||||
fileType: FileType.JS,
|
||||
...config,
|
||||
useAliasName: true,
|
||||
...(config || {}),
|
||||
};
|
||||
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
@ -147,7 +172,7 @@ const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?: Plu
|
||||
const packs = groupDepsByPack(ir.deps);
|
||||
|
||||
Object.keys(packs).forEach((pkg) => {
|
||||
const chunks = buildPackageImport(pkg, packs[pkg], cfg.fileType);
|
||||
const chunks = buildPackageImport(pkg, packs[pkg], cfg.fileType, cfg.useAliasName);
|
||||
next.chunks.push(...chunks);
|
||||
});
|
||||
}
|
||||
|
||||
@ -1,12 +1,6 @@
|
||||
import { COMMON_CHUNK_NAME } from '../../const/generator';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
} from '../../types';
|
||||
import { BuilderComponentPlugin, BuilderComponentPluginFactory, ChunkType, FileType, ICodeStruct } from '../../types';
|
||||
|
||||
// TODO: How to merge this logic to common deps
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
|
||||
@ -0,0 +1,35 @@
|
||||
import { COMMON_CHUNK_NAME } from '../../../const/generator';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
} from '../../../types';
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
content: `
|
||||
// 注意: 出码引擎注入的临时变量默认都以 "__$$" 开头，禁止在搭建的代码中直接访问。
|
||||
// 例外：rax 框架的导出名和各种组件名除外。
|
||||
import { createElement, Component } from 'rax';
|
||||
import { withRouter as __$$withRouter } from 'rax-app';
|
||||
`,
|
||||
linkAfter: [],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
18
packages/code-generator/src/plugins/component/rax/const.ts
Normal file
18
packages/code-generator/src/plugins/component/rax/const.ts
Normal file
@ -0,0 +1,18 @@
|
||||
export const RAX_CHUNK_NAME = {
|
||||
ClassDidMountBegin: 'RaxComponentClassDidMountBegin',
|
||||
ClassDidMountContent: 'RaxComponentClassDidMountContent',
|
||||
ClassDidMountEnd: 'RaxComponentClassDidMountEnd',
|
||||
ClassWillUnmountBegin: 'RaxComponentClassWillUnmountBegin',
|
||||
ClassWillUnmountContent: 'RaxComponentClassWillUnmountContent',
|
||||
ClassWillUnmountEnd: 'RaxComponentClassWillUnmountEnd',
|
||||
ClassRenderBegin: 'RaxComponentClassRenderBegin',
|
||||
ClassRenderPre: 'RaxComponentClassRenderPre',
|
||||
ClassRenderJSX: 'RaxComponentClassRenderJSX',
|
||||
ClassRenderEnd: 'RaxComponentClassRenderEnd',
|
||||
MethodsBegin: 'RaxComponentMethodsBegin',
|
||||
MethodsContent: 'RaxComponentMethodsContent',
|
||||
MethodsEnd: 'RaxComponentMethodsEnd',
|
||||
LifeCyclesBegin: 'RaxComponentLifeCyclesBegin',
|
||||
LifeCyclesContent: 'RaxComponentLifeCyclesContent',
|
||||
LifeCyclesEnd: 'RaxComponentLifeCyclesEnd',
|
||||
};
|
||||
@ -0,0 +1,144 @@
|
||||
import changeCase from 'change-case';
|
||||
import { COMMON_CHUNK_NAME, CLASS_DEFINE_CHUNK_NAME } from '../../../const/generator';
|
||||
import { RAX_CHUNK_NAME } from './const';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IContainerInfo,
|
||||
} from '../../../types';
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
const ir = next.ir as IContainerInfo;
|
||||
|
||||
// 将模块名转换成 PascalCase 的格式，并添加特定后缀，防止命名冲突
|
||||
const componentClassName = `${changeCase.pascalCase(ir.moduleName)}$$Page`;
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.Start,
|
||||
content: `class ${componentClassName} extends Component {`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.End,
|
||||
content: `}`,
|
||||
linkAfter: [
|
||||
CLASS_DEFINE_CHUNK_NAME.Start,
|
||||
CLASS_DEFINE_CHUNK_NAME.InsPrivateMethod,
|
||||
RAX_CHUNK_NAME.ClassRenderEnd,
|
||||
RAX_CHUNK_NAME.MethodsEnd,
|
||||
],
|
||||
});
|
||||
|
||||
// next.chunks.push({
|
||||
// type: ChunkType.STRING,
|
||||
// fileType: FileType.JSX,
|
||||
// name: CLASS_DEFINE_CHUNK_NAME.ConstructorStart,
|
||||
// content: 'constructor(props, context) { super(props); ',
|
||||
// linkAfter: [CLASS_DEFINE_CHUNK_NAME.Start],
|
||||
// });
|
||||
|
||||
// next.chunks.push({
|
||||
// type: ChunkType.STRING,
|
||||
// fileType: FileType.JSX,
|
||||
// name: CLASS_DEFINE_CHUNK_NAME.ConstructorEnd,
|
||||
// content: '}',
|
||||
// linkAfter: [
|
||||
// CLASS_DEFINE_CHUNK_NAME.ConstructorStart,
|
||||
// CLASS_DEFINE_CHUNK_NAME.ConstructorContent,
|
||||
// ],
|
||||
// });
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: RAX_CHUNK_NAME.ClassDidMountBegin,
|
||||
content: `componentDidMount() {`,
|
||||
linkAfter: [CLASS_DEFINE_CHUNK_NAME.Start, CLASS_DEFINE_CHUNK_NAME.InsVar, CLASS_DEFINE_CHUNK_NAME.InsMethod],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: RAX_CHUNK_NAME.ClassDidMountEnd,
|
||||
content: `}`,
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassDidMountBegin, RAX_CHUNK_NAME.ClassDidMountContent],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: RAX_CHUNK_NAME.ClassWillUnmountBegin,
|
||||
content: `componentWillUnmount() {`,
|
||||
linkAfter: [
|
||||
CLASS_DEFINE_CHUNK_NAME.Start,
|
||||
CLASS_DEFINE_CHUNK_NAME.InsVar,
|
||||
CLASS_DEFINE_CHUNK_NAME.InsMethod,
|
||||
RAX_CHUNK_NAME.ClassDidMountEnd,
|
||||
],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: RAX_CHUNK_NAME.ClassWillUnmountEnd,
|
||||
content: `}`,
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassWillUnmountBegin, RAX_CHUNK_NAME.ClassWillUnmountContent],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: RAX_CHUNK_NAME.ClassRenderBegin,
|
||||
content: 'render() {',
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassDidMountEnd, RAX_CHUNK_NAME.ClassWillUnmountEnd],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: RAX_CHUNK_NAME.ClassRenderEnd,
|
||||
content: '}',
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassRenderBegin, RAX_CHUNK_NAME.ClassRenderPre, RAX_CHUNK_NAME.ClassRenderJSX],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: COMMON_CHUNK_NAME.FileExport,
|
||||
content: `export default __$$withRouter(${componentClassName});`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
CLASS_DEFINE_CHUNK_NAME.End,
|
||||
],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
@ -0,0 +1,68 @@
|
||||
import { CLASS_DEFINE_CHUNK_NAME, DEFAULT_LINK_AFTER } from '../../../const/generator';
|
||||
|
||||
import { generateCompositeType } from '../../../utils/compositeType';
|
||||
import Scope from '../../../utils/Scope';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IContainerInfo,
|
||||
} from '../../../types';
|
||||
|
||||
type PluginConfig = {
|
||||
fileType: string;
|
||||
implementType: 'inConstructor' | 'insMember' | 'hooks';
|
||||
};
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) => {
|
||||
const cfg: PluginConfig = {
|
||||
fileType: FileType.JSX,
|
||||
implementType: 'insMember',
|
||||
...config,
|
||||
};
|
||||
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
const ir = next.ir as IContainerInfo;
|
||||
const scope = Scope.createRootScope();
|
||||
|
||||
if (ir.state) {
|
||||
const state = ir.state;
|
||||
const fields = Object.keys(state).map<string>((stateName) => {
|
||||
// TODO: 这里用什么 handlers?
|
||||
const value = generateCompositeType(state[stateName], scope);
|
||||
return `${stateName}: ${value}`;
|
||||
});
|
||||
|
||||
if (cfg.implementType === 'inConstructor') {
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.ConstructorContent,
|
||||
content: `this.state = { ${fields.join(',')} };`,
|
||||
linkAfter: [...DEFAULT_LINK_AFTER[CLASS_DEFINE_CHUNK_NAME.ConstructorContent]],
|
||||
});
|
||||
} else if (cfg.implementType === 'insMember') {
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.InsVar,
|
||||
content: `state = { ${fields.join(',')} };`,
|
||||
linkAfter: [...DEFAULT_LINK_AFTER[CLASS_DEFINE_CHUNK_NAME.InsVar]],
|
||||
});
|
||||
}
|
||||
// TODO: hooks state??
|
||||
}
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
@ -0,0 +1,116 @@
|
||||
import { CLASS_DEFINE_CHUNK_NAME, COMMON_CHUNK_NAME } from '../../../const/generator';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
} from '../../../types';
|
||||
import { RAX_CHUNK_NAME } from './const';
|
||||
|
||||
type PluginConfig = {
|
||||
fileType: string;
|
||||
};
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) => {
|
||||
const cfg: PluginConfig = {
|
||||
fileType: FileType.JSX,
|
||||
...config,
|
||||
};
|
||||
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
content: `import __$$constants from '../../constants';`,
|
||||
linkAfter: [COMMON_CHUNK_NAME.ExternalDepsImport],
|
||||
});
|
||||
|
||||
// TODO: i18n 是可选的，如果没有 i18n 这个文件怎么办？该怎么判断？
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
content: `import * as __$$i18n from '../../i18n';`,
|
||||
linkAfter: [COMMON_CHUNK_NAME.ExternalDepsImport],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.InsVar,
|
||||
content: `
|
||||
_context = this._createContext();
|
||||
`,
|
||||
linkAfter: [CLASS_DEFINE_CHUNK_NAME.Start],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.InsPrivateMethod,
|
||||
content: `
|
||||
_createContext() {
|
||||
const self = this;
|
||||
|
||||
// 保存下最新的状态，这样 setState 可以搞成同步一样的了
|
||||
self._latestState = self.state;
|
||||
|
||||
const context = {
|
||||
get state() {
|
||||
// 这里直接获取最新的 state，从而能避免一些 React/Rax 这样的框架因为异步 setState 而导致的一些问题
|
||||
return self._latestState;
|
||||
},
|
||||
setState(newState) {
|
||||
self._latestState = { ...self._latestState, ...newState };
|
||||
self.setState(newState);
|
||||
},
|
||||
get dataSourceMap() {
|
||||
return self._dataSourceEngine.dataSourceMap || {};
|
||||
},
|
||||
async reloadDataSource() {
|
||||
await self._dataSourceEngine.reloadDataSource();
|
||||
},
|
||||
get utils() {
|
||||
return self._utils;
|
||||
},
|
||||
get page() {
|
||||
return context;
|
||||
},
|
||||
get component() {
|
||||
return context;
|
||||
},
|
||||
get props() {
|
||||
return self.props;
|
||||
},
|
||||
get constants() {
|
||||
return __$$constants;
|
||||
},
|
||||
i18n: __$$i18n.i18n,
|
||||
i18nFormat: __$$i18n.i18nFormat,
|
||||
getLocale: __$$i18n.getLocale,
|
||||
setLocale(locale) {
|
||||
__$$i18n.setLocale(locale);
|
||||
self.forceUpdate();
|
||||
},
|
||||
...this._methods,
|
||||
};
|
||||
|
||||
return context;
|
||||
}
|
||||
`,
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassRenderEnd],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
@ -0,0 +1,157 @@
|
||||
/* eslint-disable @typescript-eslint/indent */
|
||||
|
||||
import { CompositeValue, JSExpression, DataSourceConfig, isJSExpression, isJSFunction } from '@ali/lowcode-types';
|
||||
import changeCase from 'change-case';
|
||||
|
||||
import { CLASS_DEFINE_CHUNK_NAME, COMMON_CHUNK_NAME } from '../../../const/generator';
|
||||
import Scope from '../../../utils/Scope';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IScope,
|
||||
} from '../../../types';
|
||||
|
||||
import { generateCompositeType } from '../../../utils/compositeType';
|
||||
import { parseExpressionConvertThis2Context } from '../../../utils/expressionParser';
|
||||
import { isContainerSchema } from '../../../utils/schema';
|
||||
import { RAX_CHUNK_NAME } from './const';
|
||||
|
||||
type PluginConfig = {
|
||||
fileType: string;
|
||||
};
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) => {
|
||||
const cfg: PluginConfig = {
|
||||
fileType: FileType.JSX,
|
||||
...config,
|
||||
};
|
||||
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
const scope = Scope.createRootScope();
|
||||
const dataSourceConfig = isContainerSchema(pre.ir) ? pre.ir.dataSource : null;
|
||||
const dataSourceItems: DataSourceConfig[] = (dataSourceConfig && dataSourceConfig.list) || [];
|
||||
const dataSourceEngineOptions = { runtimeConfig: true };
|
||||
if (dataSourceItems.length > 0) {
|
||||
const requestHandlersMap = {} as Record<string, JSExpression>;
|
||||
|
||||
dataSourceItems.forEach((ds) => {
|
||||
const dsType = ds.type || 'fetch';
|
||||
if (!(dsType in requestHandlersMap) && dsType !== 'custom') {
|
||||
const handlerFactoryName = '__$$create' + changeCase.pascal(dsType) + 'RequestHandler';
|
||||
|
||||
requestHandlersMap[dsType] = {
|
||||
type: 'JSExpression',
|
||||
value: handlerFactoryName + (dsType === 'urlParams' ? '(this.props.location.search)' : '()'),
|
||||
};
|
||||
|
||||
const handlerFactoryExportName = `create${changeCase.pascal(dsType)}Handler`;
|
||||
const handlerPkgName = `@ali/lowcode-datasource-${changeCase.kebab(dsType)}-handler`;
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
content: `
|
||||
import { ${handlerFactoryExportName} as ${handlerFactoryName} } from '${handlerPkgName}';
|
||||
`,
|
||||
linkAfter: [],
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
Object.assign(dataSourceEngineOptions, { requestHandlersMap });
|
||||
}
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
content: `
|
||||
import { create as __$$createDataSourceEngine } from '@ali/lowcode-datasource-engine/runtime';
|
||||
`,
|
||||
linkAfter: [],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.InsVar,
|
||||
content: `
|
||||
_dataSourceConfig = this._defineDataSourceConfig();
|
||||
_dataSourceEngine = __$$createDataSourceEngine(
|
||||
this._dataSourceConfig,
|
||||
this._context,
|
||||
${generateCompositeType(dataSourceEngineOptions, scope)}
|
||||
);`,
|
||||
linkAfter: [CLASS_DEFINE_CHUNK_NAME.Start],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: RAX_CHUNK_NAME.ClassDidMountContent,
|
||||
content: `
|
||||
this._dataSourceEngine.reloadDataSource();
|
||||
`,
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassDidMountBegin],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.InsPrivateMethod,
|
||||
content: `
|
||||
_defineDataSourceConfig() {
|
||||
const __$$context = this._context;
|
||||
return (${generateCompositeType(
|
||||
{
|
||||
...dataSourceConfig,
|
||||
list: [
|
||||
...dataSourceItems.map((item) => ({
|
||||
...item,
|
||||
isInit: wrapAsFunction(item.isInit, scope),
|
||||
options: wrapAsFunction(item.options, scope),
|
||||
})),
|
||||
],
|
||||
},
|
||||
scope,
|
||||
{
|
||||
handlers: {
|
||||
function: (jsFunc) => parseExpressionConvertThis2Context(jsFunc.value, '__$$context'),
|
||||
expression: (jsExpr) => parseExpressionConvertThis2Context(jsExpr.value, '__$$context'),
|
||||
},
|
||||
},
|
||||
)});
|
||||
}
|
||||
`,
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassRenderEnd],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
|
||||
function wrapAsFunction(value: CompositeValue, scope: IScope): CompositeValue {
|
||||
if (isJSExpression(value) || isJSFunction(value)) {
|
||||
return {
|
||||
type: 'JSExpression',
|
||||
value: `function(){ return ((${value.value}))}`,
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
type: 'JSExpression',
|
||||
value: `function(){return((${generateCompositeType(value, scope)}))}`,
|
||||
};
|
||||
}
|
||||
@ -0,0 +1,74 @@
|
||||
import { CLASS_DEFINE_CHUNK_NAME, COMMON_CHUNK_NAME } from '../../../const/generator';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
} from '../../../types';
|
||||
import { RAX_CHUNK_NAME } from './const';
|
||||
|
||||
type PluginConfig = {
|
||||
fileType: string;
|
||||
};
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) => {
|
||||
const cfg: PluginConfig = {
|
||||
fileType: FileType.JSX,
|
||||
...config,
|
||||
};
|
||||
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
// TODO: 下面这个路径有没有更好的方式来获取？而非写死
|
||||
content: `
|
||||
import __$$projectUtils from '../../utils';
|
||||
`,
|
||||
linkAfter: [COMMON_CHUNK_NAME.ExternalDepsImport],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.InsVar,
|
||||
content: `_utils = this._defineUtils();`,
|
||||
linkAfter: [CLASS_DEFINE_CHUNK_NAME.Start],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.InsPrivateMethod,
|
||||
|
||||
// 绑定下上下文，这样在所有的 utils 里面都能通过 this.xxx 来访问上下文了
|
||||
content: `
|
||||
_defineUtils() {
|
||||
const utils = {
|
||||
...__$$projectUtils,
|
||||
};
|
||||
|
||||
Object.entries(utils).forEach(([name, util]) => {
|
||||
if (typeof util === 'function') {
|
||||
utils[name] = util.bind(this._context);
|
||||
}
|
||||
});
|
||||
|
||||
return utils;
|
||||
}`,
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassRenderEnd],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
@ -0,0 +1,120 @@
|
||||
import _ from 'lodash';
|
||||
|
||||
import { CLASS_DEFINE_CHUNK_NAME } from '../../../const/generator';
|
||||
import { RAX_CHUNK_NAME } from './const';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
FileType,
|
||||
ChunkType,
|
||||
ICodeStruct,
|
||||
IContainerInfo,
|
||||
} from '../../../types';
|
||||
|
||||
type PluginConfig = {
|
||||
fileType: string;
|
||||
exportNameMapping: Record<string, string>;
|
||||
normalizeNameMapping: Record<string, string>;
|
||||
};
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) => {
|
||||
const cfg: PluginConfig = {
|
||||
fileType: FileType.JSX,
|
||||
exportNameMapping: {},
|
||||
normalizeNameMapping: {},
|
||||
...config,
|
||||
};
|
||||
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
// Rax 先只支持 didMount 和 willUnmount 吧
|
||||
|
||||
const ir = next.ir as IContainerInfo;
|
||||
const lifeCycles = ir.lifeCycles;
|
||||
|
||||
if (lifeCycles && !_.isEmpty(lifeCycles)) {
|
||||
Object.entries(lifeCycles).forEach(([lifeCycleName, lifeCycleMethodExpr]) => {
|
||||
const normalizeName = cfg.normalizeNameMapping[lifeCycleName] || lifeCycleName;
|
||||
const exportName = cfg.exportNameMapping[lifeCycleName] || lifeCycleName;
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: RAX_CHUNK_NAME.LifeCyclesContent,
|
||||
content: `${exportName}: (${lifeCycleMethodExpr.value}),`,
|
||||
linkAfter: [RAX_CHUNK_NAME.LifeCyclesBegin],
|
||||
});
|
||||
|
||||
if (normalizeName === 'didMount') {
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: RAX_CHUNK_NAME.ClassDidMountContent,
|
||||
content: `this._lifeCycles.${exportName}();`,
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassDidMountBegin],
|
||||
});
|
||||
} else if (normalizeName === 'willUnmount') {
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: RAX_CHUNK_NAME.ClassWillUnmountContent,
|
||||
content: `this._lifeCycles.${exportName}();`,
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassWillUnmountBegin],
|
||||
});
|
||||
} else {
|
||||
// TODO: print warnings? Unknown life cycle
|
||||
}
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.InsVar,
|
||||
content: `_lifeCycles = this._defineLifeCycles();`,
|
||||
linkAfter: [CLASS_DEFINE_CHUNK_NAME.Start],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: RAX_CHUNK_NAME.LifeCyclesBegin,
|
||||
content: `
|
||||
_defineLifeCycles() {
|
||||
const __$$lifeCycles = ({
|
||||
`,
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassRenderEnd, CLASS_DEFINE_CHUNK_NAME.InsPrivateMethod],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: RAX_CHUNK_NAME.LifeCyclesEnd,
|
||||
content: `
|
||||
});
|
||||
|
||||
// 为所有的方法绑定上下文
|
||||
Object.entries(__$$lifeCycles).forEach(([lifeCycleName, lifeCycleMethod]) => {
|
||||
if (typeof lifeCycleMethod === 'function') {
|
||||
__$$lifeCycles[lifeCycleName] = (...args) => {
|
||||
return lifeCycleMethod.apply(this._context, args);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return __$$lifeCycles;
|
||||
}
|
||||
`,
|
||||
linkAfter: [RAX_CHUNK_NAME.LifeCyclesBegin, RAX_CHUNK_NAME.LifeCyclesContent],
|
||||
});
|
||||
}
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
@ -0,0 +1,95 @@
|
||||
import { CLASS_DEFINE_CHUNK_NAME } from '../../../const/generator';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IContainerInfo,
|
||||
} from '../../../types';
|
||||
|
||||
import { RAX_CHUNK_NAME } from './const';
|
||||
|
||||
type PluginConfig = {
|
||||
fileType: string;
|
||||
};
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) => {
|
||||
const cfg: PluginConfig = {
|
||||
fileType: FileType.JSX,
|
||||
...config,
|
||||
};
|
||||
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
const ir = next.ir as IContainerInfo;
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.InsVar,
|
||||
content: `
|
||||
_methods = this._defineMethods();
|
||||
`,
|
||||
linkAfter: [CLASS_DEFINE_CHUNK_NAME.Start],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: RAX_CHUNK_NAME.MethodsBegin,
|
||||
content: `
|
||||
_defineMethods() {
|
||||
const __$$methods = ({
|
||||
`,
|
||||
linkAfter: [
|
||||
RAX_CHUNK_NAME.ClassRenderEnd,
|
||||
CLASS_DEFINE_CHUNK_NAME.InsPrivateMethod,
|
||||
RAX_CHUNK_NAME.LifeCyclesEnd,
|
||||
],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: RAX_CHUNK_NAME.MethodsEnd,
|
||||
content: `
|
||||
});
|
||||
|
||||
// 为所有的方法绑定上下文
|
||||
Object.entries(__$$methods).forEach(([methodName, method]) => {
|
||||
if (typeof method === 'function') {
|
||||
__$$methods[methodName] = (...args) => {
|
||||
return method.apply(this._context, args);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return __$$methods;
|
||||
}
|
||||
`,
|
||||
linkAfter: [RAX_CHUNK_NAME.MethodsBegin, RAX_CHUNK_NAME.MethodsContent],
|
||||
});
|
||||
|
||||
if (ir.methods && Object.keys(ir.methods).length > 0) {
|
||||
Object.entries(ir.methods).forEach(([methodName, methodDefine]) => {
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: RAX_CHUNK_NAME.MethodsContent,
|
||||
content: `${methodName}: (${methodDefine.value}),`,
|
||||
linkAfter: [RAX_CHUNK_NAME.MethodsBegin],
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
350
packages/code-generator/src/plugins/component/rax/jsx.ts
Normal file
350
packages/code-generator/src/plugins/component/rax/jsx.ts
Normal file
@ -0,0 +1,350 @@
|
||||
import { NodeSchema, JSExpression, NpmInfo, CompositeValue, isJSExpression } from '@ali/lowcode-types';
|
||||
|
||||
import _ from 'lodash';
|
||||
import changeCase from 'change-case';
|
||||
import { Expression } from '@babel/types';
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
CodePiece,
|
||||
FileType,
|
||||
ICodeChunk,
|
||||
ICodeStruct,
|
||||
IContainerInfo,
|
||||
PIECE_TYPE,
|
||||
HandlerSet,
|
||||
IScope,
|
||||
NodeGeneratorConfig,
|
||||
NodePlugin,
|
||||
AttrPlugin,
|
||||
} from '../../../types';
|
||||
|
||||
import { RAX_CHUNK_NAME } from './const';
|
||||
import { COMMON_CHUNK_NAME } from '../../../const/generator';
|
||||
|
||||
import { generateExpression } from '../../../utils/jsExpression';
|
||||
import { createNodeGenerator, generateConditionReactCtrl, generateReactExprInJS } from '../../../utils/nodeToJSX';
|
||||
import { generateCompositeType } from '../../../utils/compositeType';
|
||||
import Scope from '../../../utils/Scope';
|
||||
import {
|
||||
parseExpression,
|
||||
parseExpressionConvertThis2Context,
|
||||
parseExpressionGetGlobalVariables,
|
||||
} from '../../../utils/expressionParser';
|
||||
|
||||
type PluginConfig = {
|
||||
fileType: string;
|
||||
};
|
||||
|
||||
// TODO: componentName 若并非大写字符打头，甚至并非是一个有效的 JS 标识符怎么办？？
|
||||
// FIXME: 我想了下，这块应该放到解析阶段就去做掉，对所有 componentName 做 identifier validate，然后对不合法的做统一替换。
|
||||
const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) => {
|
||||
const cfg: PluginConfig = {
|
||||
fileType: FileType.JSX,
|
||||
...config,
|
||||
};
|
||||
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
const ir = next.ir as IContainerInfo;
|
||||
const rootScope = Scope.createRootScope();
|
||||
|
||||
// Rax 构建到小程序的时候，不能给组件起起别名，得直接引用，故这里将所有的别名替换掉
|
||||
// 先收集下所有的 alias 的映射
|
||||
const componentsNameAliasMap = new Map<string, string>();
|
||||
next.chunks.forEach((chunk) => {
|
||||
if (isImportAliasDefineChunk(chunk)) {
|
||||
componentsNameAliasMap.set(chunk.ext.aliasName, chunk.ext.originalName);
|
||||
}
|
||||
});
|
||||
|
||||
// 注意：这里其实隐含了一个假设：schema 中的 componentName 应该是一个有效的 JS 标识符，而且是大写字母打头的
|
||||
const mapComponentNameToAliasOrKeepIt = (componentName: string) =>
|
||||
componentsNameAliasMap.get(componentName) || componentName;
|
||||
|
||||
// 然后过滤掉所有的别名 chunks
|
||||
next.chunks = next.chunks.filter((chunk) => !isImportAliasDefineChunk(chunk));
|
||||
|
||||
// 如果直接按目前的 React 的方式之间出码 JSX 的话，会有 3 个问题：
|
||||
// 1. 小程序出码的时候，循环变量没法拿到
|
||||
// 2. 小程序出码的时候，很容易出现 Uncaught TypeError: Cannot read property 'avatar' of undefined 这样的异常(如下图的 50 行) -- 因为若直接出码，Rax 构建到小程序的时候会立即计算所有在视图中用到的变量
|
||||
// 3. 通过 this.xxx 能拿到的东西太多了，而且自定义的 methods 可能会无意间破坏 Rax 框架或小程序框架在页面 this 上的东东
|
||||
const customHandlers: HandlerSet<string> = {
|
||||
expression(input: JSExpression, scope: IScope) {
|
||||
return transformJsExpr(generateExpression(input), scope);
|
||||
},
|
||||
function(input, scope: IScope) {
|
||||
return transformThis2Context(input.value || 'null', scope);
|
||||
},
|
||||
};
|
||||
|
||||
// 创建代码生成器
|
||||
const commonNodeGenerator = createNodeGenerator({
|
||||
handlers: customHandlers,
|
||||
tagMapping: mapComponentNameToAliasOrKeepIt,
|
||||
nodePlugins: [generateReactExprInJS, generateConditionReactCtrl, generateRaxLoopCtrl],
|
||||
attrPlugins: [generateNodeAttrForRax],
|
||||
});
|
||||
|
||||
// 生成 JSX 代码
|
||||
const jsxContent = commonNodeGenerator(ir, rootScope);
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
content: `import { isMiniApp as __$$isMiniApp } from 'universal-env';`,
|
||||
linkAfter: [],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: RAX_CHUNK_NAME.ClassRenderPre,
|
||||
// TODO: setState, dataSourceMap, reloadDataSource, utils, i18n, i18nFormat, getLocale, setLocale 这些在 Rax 的编译模式下不能在视图中直接访问，需要转化成 this.xxx
|
||||
content: `
|
||||
const __$$context = this._context;
|
||||
const { state, setState, dataSourceMap, reloadDataSource, utils, constants, i18n, i18nFormat, getLocale, setLocale } = __$$context;
|
||||
`,
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassRenderBegin],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: RAX_CHUNK_NAME.ClassRenderJSX,
|
||||
content: `return ${jsxContent};`,
|
||||
linkAfter: [RAX_CHUNK_NAME.ClassRenderBegin, RAX_CHUNK_NAME.ClassRenderPre],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: COMMON_CHUNK_NAME.CustomContent,
|
||||
content: `
|
||||
|
||||
function __$$eval(expr) {
|
||||
try {
|
||||
return expr();
|
||||
} catch (err) {
|
||||
console.warn('Failed to evaluate: ', expr, err);
|
||||
}
|
||||
}
|
||||
|
||||
function __$$evalArray(expr) {
|
||||
const res = __$$eval(expr);
|
||||
return Array.isArray(res) ? res : [];
|
||||
}
|
||||
|
||||
`,
|
||||
linkAfter: [COMMON_CHUNK_NAME.FileExport],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
|
||||
function transformJsExpr(expr: string, scope: IScope) {
|
||||
if (!expr) {
|
||||
return 'undefined';
|
||||
}
|
||||
|
||||
if (isLiteralAtomicExpr(expr)) {
|
||||
return expr;
|
||||
}
|
||||
|
||||
const exprAst = parseExpression(expr);
|
||||
|
||||
// 对于下面这些比较安全的字面值，可以直接返回对应的表达式，而非包一层
|
||||
if (isSimpleStraightLiteral(exprAst)) {
|
||||
return expr;
|
||||
}
|
||||
|
||||
switch (exprAst.type) {
|
||||
// 对于直接写个函数的，则不用再包下，因为这样不会抛出异常的
|
||||
case 'ArrowFunctionExpression':
|
||||
case 'FunctionExpression':
|
||||
return transformThis2Context(exprAst, scope);
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
|
||||
// 其他的都需要包一层
|
||||
return `__$$eval(() => (${transformThis2Context(exprAst, scope)}))`;
|
||||
}
|
||||
|
||||
/** 判断是非是一些简单直接的字面值 */
|
||||
function isSimpleStraightLiteral(expr: Expression): boolean {
|
||||
switch (expr.type) {
|
||||
case 'BigIntLiteral':
|
||||
case 'BooleanLiteral':
|
||||
case 'DecimalLiteral':
|
||||
case 'NullLiteral':
|
||||
case 'NumericLiteral':
|
||||
case 'RegExpLiteral':
|
||||
case 'StringLiteral':
|
||||
return true;
|
||||
default:
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function isImportAliasDefineChunk(
|
||||
chunk: ICodeChunk,
|
||||
): chunk is ICodeChunk & {
|
||||
ext: {
|
||||
aliasName: string;
|
||||
originalName: string;
|
||||
dependency: NpmInfo;
|
||||
};
|
||||
} {
|
||||
return (
|
||||
chunk.name === COMMON_CHUNK_NAME.ImportAliasDefine &&
|
||||
!!chunk.ext &&
|
||||
typeof chunk.ext.aliasName === 'string' &&
|
||||
typeof chunk.ext.originalName === 'string' &&
|
||||
!!(chunk.ext.dependency as NpmInfo | null)?.componentName
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断是否是原子类型的表达式
|
||||
*/
|
||||
function isLiteralAtomicExpr(expr: string): boolean {
|
||||
return expr === 'null' || expr === 'undefined' || expr === 'true' || expr === 'false' || /^-?\d+(\.\d+)?$/.test(expr);
|
||||
}
|
||||
|
||||
/**
|
||||
* 将所有的 this.xxx 替换为 __$$context.xxx
|
||||
* @param expr
|
||||
*/
|
||||
function transformThis2Context(expr: string | Expression, scope: IScope): string {
|
||||
// 下面这种字符串替换的方式虽然简单直接，但是对于复杂场景会误匹配，故后期改成了解析 AST 然后修改 AST 最后再重新生成代码的方式
|
||||
// return expr
|
||||
// .replace(/\bthis\.item\./g, () => 'item.')
|
||||
// .replace(/\bthis\.index\./g, () => 'index.')
|
||||
// .replace(/\bthis\./g, () => '__$$context.');
|
||||
|
||||
return parseExpressionConvertThis2Context(expr, '__$$context', scope.bindings?.getAllBindings() || []);
|
||||
}
|
||||
|
||||
function generateRaxLoopCtrl(
|
||||
nodeItem: NodeSchema,
|
||||
scope: IScope,
|
||||
config?: NodeGeneratorConfig,
|
||||
next?: NodePlugin,
|
||||
): CodePiece[] {
|
||||
if (nodeItem.loop) {
|
||||
const loopItemName = nodeItem.loopArgs?.[0] || 'item';
|
||||
const loopIndexName = nodeItem.loopArgs?.[1] || 'index';
|
||||
const subScope = scope.createSubScope([loopItemName, loopIndexName]);
|
||||
const pieces: CodePiece[] = next ? next(nodeItem, subScope, config) : [];
|
||||
|
||||
const loopDataExpr = `__$$evalArray(() => (${transformThis2Context(
|
||||
generateCompositeType(nodeItem.loop, scope, { handlers: config?.handlers }),
|
||||
scope,
|
||||
)}))`;
|
||||
|
||||
pieces.unshift({
|
||||
value: `${loopDataExpr}.map((${loopItemName}, ${loopIndexName}) => (`,
|
||||
type: PIECE_TYPE.BEFORE,
|
||||
});
|
||||
|
||||
pieces.push({
|
||||
value: '))',
|
||||
type: PIECE_TYPE.AFTER,
|
||||
});
|
||||
|
||||
return pieces;
|
||||
}
|
||||
|
||||
return next ? next(nodeItem, scope, config) : [];
|
||||
}
|
||||
|
||||
function generateNodeAttrForRax(
|
||||
attrData: { attrName: string; attrValue: CompositeValue },
|
||||
scope: IScope,
|
||||
config?: NodeGeneratorConfig,
|
||||
next?: AttrPlugin,
|
||||
): CodePiece[] {
|
||||
if (!/^on/.test(attrData.attrName)) {
|
||||
return next ? next(attrData, scope, config) : [];
|
||||
}
|
||||
// else: onXxx 的都是事件处理函数需要特殊处理下
|
||||
return generateEventHandlerAttrForRax(attrData.attrName, attrData.attrValue, scope, config);
|
||||
}
|
||||
|
||||
function generateEventHandlerAttrForRax(
|
||||
attrName: string,
|
||||
attrValue: CompositeValue,
|
||||
scope: IScope,
|
||||
config?: NodeGeneratorConfig,
|
||||
): CodePiece[] {
|
||||
// -- 事件处理函数中 JSExpression 转成 JSFunction 来处理，避免当 JSExpression 处理的时候多包一层 eval 而导致 Rax 转码成小程序的时候出问题
|
||||
const valueExpr = generateCompositeType(
|
||||
isJSExpression(attrValue) ? { type: 'JSFunction', value: attrValue.value } : attrValue,
|
||||
scope,
|
||||
{
|
||||
handlers: config?.handlers,
|
||||
},
|
||||
);
|
||||
|
||||
// 查询当前作用域下的变量
|
||||
const currentScopeVariables = scope.bindings?.getAllBindings() || [];
|
||||
if (currentScopeVariables.length <= 0) {
|
||||
return [
|
||||
{
|
||||
type: PIECE_TYPE.ATTR,
|
||||
name: attrName,
|
||||
value: valueExpr,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
// 提取出所有的未定义的全局变量
|
||||
const undeclaredVariablesInValueExpr = parseExpressionGetGlobalVariables(valueExpr);
|
||||
const referencedLocalVariables = _.intersection(undeclaredVariablesInValueExpr, currentScopeVariables);
|
||||
if (referencedLocalVariables.length <= 0) {
|
||||
return [
|
||||
{
|
||||
type: PIECE_TYPE.ATTR,
|
||||
name: attrName,
|
||||
value: valueExpr,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
const wrappedAttrValueExpr = [
|
||||
`(...__$$args) => {`,
|
||||
` if (__$$isMiniApp) {`,
|
||||
` const __$$event = __$$args[0];`,
|
||||
...referencedLocalVariables.map((localVar) => `const ${localVar} = __$$event.target.dataset.${localVar};`),
|
||||
` return (${valueExpr}).apply(this, __$$args);`,
|
||||
` } else {`,
|
||||
` return (${valueExpr}).apply(this, __$$args);`,
|
||||
` }`,
|
||||
`}`,
|
||||
].join('\n');
|
||||
|
||||
return [
|
||||
...referencedLocalVariables.map((localVar) => ({
|
||||
type: PIECE_TYPE.ATTR,
|
||||
name: `data-${changeCase.snake(localVar)}`,
|
||||
value: localVar,
|
||||
})),
|
||||
{
|
||||
type: PIECE_TYPE.ATTR,
|
||||
name: attrName,
|
||||
value: wrappedAttrValueExpr,
|
||||
},
|
||||
];
|
||||
}
|
||||
@ -1,3 +1,4 @@
|
||||
import changeCase from 'change-case';
|
||||
import { COMMON_CHUNK_NAME, CLASS_DEFINE_CHUNK_NAME } from '../../../const/generator';
|
||||
import { REACT_CHUNK_NAME } from './const';
|
||||
|
||||
@ -18,14 +19,18 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
|
||||
const ir = next.ir as IContainerInfo;
|
||||
|
||||
// 将模块名转换成 PascalCase 的格式，并添加特定后缀，防止命名冲突
|
||||
const componentClassName = `${changeCase.pascalCase(ir.moduleName)}$$Page`;
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.Start,
|
||||
content: `class ${ir.moduleName} extends React.Component {`,
|
||||
content: `class ${componentClassName} extends React.Component {`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
],
|
||||
@ -36,7 +41,10 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
fileType: FileType.JSX,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.End,
|
||||
content: `}`,
|
||||
linkAfter: [CLASS_DEFINE_CHUNK_NAME.Start, REACT_CHUNK_NAME.ClassRenderEnd],
|
||||
linkAfter: [
|
||||
CLASS_DEFINE_CHUNK_NAME.Start,
|
||||
REACT_CHUNK_NAME.ClassRenderEnd,
|
||||
],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
@ -52,10 +60,7 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
fileType: FileType.JSX,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.ConstructorEnd,
|
||||
content: '}',
|
||||
linkAfter: [
|
||||
CLASS_DEFINE_CHUNK_NAME.ConstructorStart,
|
||||
CLASS_DEFINE_CHUNK_NAME.ConstructorContent,
|
||||
],
|
||||
linkAfter: [CLASS_DEFINE_CHUNK_NAME.ConstructorStart, CLASS_DEFINE_CHUNK_NAME.ConstructorContent],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
@ -75,21 +80,18 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
fileType: FileType.JSX,
|
||||
name: REACT_CHUNK_NAME.ClassRenderEnd,
|
||||
content: '}',
|
||||
linkAfter: [
|
||||
REACT_CHUNK_NAME.ClassRenderStart,
|
||||
REACT_CHUNK_NAME.ClassRenderPre,
|
||||
REACT_CHUNK_NAME.ClassRenderJSX,
|
||||
],
|
||||
linkAfter: [REACT_CHUNK_NAME.ClassRenderStart, REACT_CHUNK_NAME.ClassRenderPre, REACT_CHUNK_NAME.ClassRenderJSX],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: COMMON_CHUNK_NAME.FileExport,
|
||||
content: `export default ${ir.moduleName};`,
|
||||
content: `export default ${componentClassName};`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
CLASS_DEFINE_CHUNK_NAME.End,
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
import { CLASS_DEFINE_CHUNK_NAME } from '../../../const/generator';
|
||||
|
||||
import { generateCompositeType } from '../../../utils/compositeType';
|
||||
import Scope from '../../../utils/Scope';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
@ -28,10 +29,12 @@ const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) =>
|
||||
|
||||
const ir = next.ir as IContainerInfo;
|
||||
|
||||
const scope = Scope.createRootScope();
|
||||
|
||||
if (ir.state) {
|
||||
const state = ir.state;
|
||||
const fields = Object.keys(state).map<string>((stateName) => {
|
||||
const value = generateCompositeType(state[stateName]);
|
||||
const value = generateCompositeType(state[stateName], scope);
|
||||
return `${stateName}: ${value},`;
|
||||
});
|
||||
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
import { CLASS_DEFINE_CHUNK_NAME, DEFAULT_LINK_AFTER } from '../../../const/generator';
|
||||
|
||||
import { generateCompositeType } from '../../../utils/compositeType';
|
||||
import Scope from '../../../utils/Scope';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
@ -29,11 +30,12 @@ const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) =>
|
||||
};
|
||||
|
||||
const ir = next.ir as IContainerInfo;
|
||||
const scope = Scope.createRootScope();
|
||||
|
||||
if (ir.state) {
|
||||
const state = ir.state;
|
||||
const fields = Object.keys(state).map<string>((stateName) => {
|
||||
const value = generateCompositeType(state[stateName]);
|
||||
const value = generateCompositeType(state[stateName], scope);
|
||||
return `${stateName}: ${value},`;
|
||||
});
|
||||
|
||||
|
||||
@ -5,16 +5,18 @@ import {
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IContainerInfo,
|
||||
IScope,
|
||||
} from '../../../types';
|
||||
|
||||
import { REACT_CHUNK_NAME } from './const';
|
||||
|
||||
import { createReactNodeGenerator } from '../../../utils/nodeToJSX';
|
||||
import Scope from '../../../utils/Scope';
|
||||
|
||||
type PluginConfig = {
|
||||
fileType?: string;
|
||||
nodeTypeMapping?: Record<string, string>;
|
||||
}
|
||||
};
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) => {
|
||||
const cfg = {
|
||||
@ -23,7 +25,11 @@ const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) =>
|
||||
...config,
|
||||
};
|
||||
|
||||
const generator = createReactNodeGenerator({ nodeTypeMapping: cfg.nodeTypeMapping });
|
||||
const { nodeTypeMapping } = cfg;
|
||||
|
||||
const generator = createReactNodeGenerator({
|
||||
tagMapping: (v) => nodeTypeMapping[v] || v,
|
||||
});
|
||||
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
@ -31,17 +37,15 @@ const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) =>
|
||||
};
|
||||
|
||||
const ir = next.ir as IContainerInfo;
|
||||
const jsxContent = generator(ir);
|
||||
const scope: IScope = Scope.createRootScope();
|
||||
const jsxContent = generator(ir, scope);
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: REACT_CHUNK_NAME.ClassRenderJSX,
|
||||
content: `return ${jsxContent};`,
|
||||
linkAfter: [
|
||||
REACT_CHUNK_NAME.ClassRenderStart,
|
||||
REACT_CHUNK_NAME.ClassRenderPre,
|
||||
],
|
||||
linkAfter: [REACT_CHUNK_NAME.ClassRenderStart, REACT_CHUNK_NAME.ClassRenderPre],
|
||||
});
|
||||
|
||||
return next;
|
||||
|
||||
@ -6,7 +6,6 @@ import {
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IContainerInfo,
|
||||
} from '../../../types';
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
|
||||
@ -1,3 +0,0 @@
|
||||
export const RECORE_CHUNK_NAME = {
|
||||
|
||||
};
|
||||
@ -1,4 +1,7 @@
|
||||
import { JSExpression, CompositeValue } from '@ali/lowcode-types';
|
||||
|
||||
import { CLASS_DEFINE_CHUNK_NAME, DEFAULT_LINK_AFTER } from '../../../const/generator';
|
||||
import Scope from '../../../utils/Scope';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
@ -7,15 +10,13 @@ import {
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IContainerInfo,
|
||||
IJSExpression,
|
||||
CompositeValue,
|
||||
} from '../../../types';
|
||||
|
||||
import { generateCompositeType } from '../../../utils/compositeType';
|
||||
import { generateExpression } from '../../../utils/jsExpression';
|
||||
|
||||
function packJsExpression(exp: unknown): string {
|
||||
const expression = exp as IJSExpression;
|
||||
const expression = exp as JSExpression;
|
||||
const funcStr = generateExpression(expression);
|
||||
return `function() { return (${funcStr}); }`;
|
||||
}
|
||||
@ -27,6 +28,8 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
};
|
||||
|
||||
const ir = next.ir as IContainerInfo;
|
||||
const scope = Scope.createRootScope();
|
||||
|
||||
if (ir.dataSource) {
|
||||
const { dataSource } = ir;
|
||||
const { list, ...rest } = dataSource;
|
||||
@ -35,13 +38,13 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
|
||||
const extConfigs = Object.keys(rest).map((extConfigName) => {
|
||||
const value = (rest as Record<string, CompositeValue>)[extConfigName];
|
||||
const valueStr = generateCompositeType(value);
|
||||
const valueStr = generateCompositeType(value, scope);
|
||||
return `${extConfigName}: ${valueStr}`;
|
||||
});
|
||||
|
||||
attrs = [...attrs, ...extConfigs];
|
||||
|
||||
const listProp = generateCompositeType((list as unknown) as CompositeValue, {
|
||||
const listProp = generateCompositeType((list as unknown) as CompositeValue, scope, {
|
||||
handlers: {
|
||||
expression: packJsExpression,
|
||||
},
|
||||
|
||||
@ -22,7 +22,7 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.TS,
|
||||
name: CLASS_DEFINE_CHUNK_NAME.StaticVar,
|
||||
content: `static cssText = '${ir.css.replace(/\'/g, '\\\'')}';`,
|
||||
content: `static cssText = '${ir.css.replace(/'/g, "\\'")}';`,
|
||||
linkAfter: [...DEFAULT_LINK_AFTER[CLASS_DEFINE_CHUNK_NAME.StaticVar]],
|
||||
});
|
||||
}
|
||||
|
||||
@ -1,21 +1,22 @@
|
||||
import { NodeSchema } from '@ali/lowcode-types';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
ICodeStruct,
|
||||
IContainerInfo,
|
||||
IComponentNodeItem,
|
||||
INodeGeneratorContext,
|
||||
IScope,
|
||||
CodePiece,
|
||||
PIECE_TYPE,
|
||||
} from '../../../types';
|
||||
import { COMMON_CHUNK_NAME } from '../../../const/generator';
|
||||
|
||||
import { createNodeGenerator, generateString } from '../../../utils/nodeToJSX';
|
||||
import { generateExpression } from '../../../utils/jsExpression';
|
||||
import { createNodeGenerator } from '../../../utils/nodeToJSX';
|
||||
import { generateCompositeType } from '../../../utils/compositeType';
|
||||
import Scope from '../../../utils/Scope';
|
||||
|
||||
const generateGlobalProps = (ctx: INodeGeneratorContext, nodeItem: IComponentNodeItem): CodePiece[] => {
|
||||
const generateGlobalProps = (nodeItem: NodeSchema): CodePiece[] => {
|
||||
return [
|
||||
{
|
||||
value: `{...globalProps.${nodeItem.componentName}}`,
|
||||
@ -24,11 +25,11 @@ const generateGlobalProps = (ctx: INodeGeneratorContext, nodeItem: IComponentNod
|
||||
];
|
||||
};
|
||||
|
||||
const generateCtrlLine = (ctx: INodeGeneratorContext, nodeItem: IComponentNodeItem): CodePiece[] => {
|
||||
const generateCtrlLine = (nodeItem: NodeSchema, scope: IScope): CodePiece[] => {
|
||||
const pieces: CodePiece[] = [];
|
||||
|
||||
if (nodeItem.loop && nodeItem.loopArgs) {
|
||||
const loopDataExp = generateCompositeType(nodeItem.loop);
|
||||
const loopDataExp = generateCompositeType(nodeItem.loop, scope);
|
||||
pieces.push({
|
||||
type: PIECE_TYPE.ATTR,
|
||||
value: `x-for={${loopDataExp}}`,
|
||||
@ -41,7 +42,7 @@ const generateCtrlLine = (ctx: INodeGeneratorContext, nodeItem: IComponentNodeIt
|
||||
}
|
||||
|
||||
if (nodeItem.condition) {
|
||||
const conditionExp = generateCompositeType(nodeItem.condition);
|
||||
const conditionExp = generateCompositeType(nodeItem.condition, scope);
|
||||
pieces.push({
|
||||
type: PIECE_TYPE.ATTR,
|
||||
value: `x-if={${conditionExp}}`,
|
||||
@ -52,13 +53,9 @@ const generateCtrlLine = (ctx: INodeGeneratorContext, nodeItem: IComponentNodeIt
|
||||
};
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
const generator = createNodeGenerator(
|
||||
{
|
||||
string: generateString,
|
||||
expression: (input) => [generateExpression(input)],
|
||||
},
|
||||
[generateGlobalProps, generateCtrlLine],
|
||||
);
|
||||
const generator = createNodeGenerator({
|
||||
nodePlugins: [generateGlobalProps, generateCtrlLine],
|
||||
});
|
||||
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
@ -66,8 +63,9 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
};
|
||||
|
||||
const ir = next.ir as IContainerInfo;
|
||||
const scope = Scope.createRootScope();
|
||||
|
||||
const vxContent = generator(ir);
|
||||
const vxContent = generator(ir, scope);
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
|
||||
@ -1,11 +1,6 @@
|
||||
import { COMMON_CHUNK_NAME } from '../../../const/generator';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
ICodeStruct,
|
||||
} from '../../../types';
|
||||
import { BuilderComponentPlugin, BuilderComponentPluginFactory, ChunkType, ICodeStruct } from '../../../types';
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
|
||||
@ -12,7 +12,7 @@ import {
|
||||
type PluginConfig = {
|
||||
fileType: string;
|
||||
moduleFileType: string;
|
||||
}
|
||||
};
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<PluginConfig> = (config?) => {
|
||||
const cfg: PluginConfig = {
|
||||
|
||||
@ -8,6 +8,7 @@ import {
|
||||
ICodeStruct,
|
||||
IProjectInfo,
|
||||
} from '../../types';
|
||||
import Scope from '../../utils/Scope';
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
@ -16,35 +17,39 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
};
|
||||
|
||||
const ir = next.ir as IProjectInfo;
|
||||
if (ir.constants) {
|
||||
const constantStr = generateCompositeType(ir.constants);
|
||||
const scope = Scope.createRootScope();
|
||||
const constantStr = generateCompositeType(ir.constants || {}, scope);
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
name: COMMON_CHUNK_NAME.FileVarDefine,
|
||||
content: `
|
||||
const constantConfig = ${constantStr};
|
||||
`,
|
||||
linkAfter: [COMMON_CHUNK_NAME.ExternalDepsImport, COMMON_CHUNK_NAME.InternalDepsImport],
|
||||
});
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
name: COMMON_CHUNK_NAME.FileVarDefine,
|
||||
content: `
|
||||
const __$$constants = (${constantStr});
|
||||
`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
name: COMMON_CHUNK_NAME.FileExport,
|
||||
content: `
|
||||
export default constantConfig;
|
||||
`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
COMMON_CHUNK_NAME.FileMainContent,
|
||||
],
|
||||
});
|
||||
}
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
name: COMMON_CHUNK_NAME.FileExport,
|
||||
content: `
|
||||
export default __$$constants;
|
||||
`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
COMMON_CHUNK_NAME.FileMainContent,
|
||||
],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
|
||||
@ -6,7 +6,6 @@ import {
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IProjectInfo,
|
||||
} from '../../../../../types';
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
@ -15,8 +14,6 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
...pre,
|
||||
};
|
||||
|
||||
const ir = next.ir as IProjectInfo;
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
@ -34,10 +31,10 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
content: `
|
||||
const appConfig = {
|
||||
app: {
|
||||
rootId: '${ir.config.targetRootID}',
|
||||
rootId: 'app',
|
||||
},
|
||||
router: {
|
||||
type: '${ir.config.historyMode}',
|
||||
type: 'hash',
|
||||
},
|
||||
};
|
||||
createApp(appConfig);
|
||||
@ -45,6 +42,7 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
],
|
||||
|
||||
@ -28,10 +28,10 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="x-ua-compatible" content="ie=edge,chrome=1" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<title>${ir.meta.name}</title>
|
||||
<title>${ir?.meta?.name || 'Ice App'}</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="${ir.config.targetRootID}"></div>
|
||||
<div id="app"></div>
|
||||
</body>
|
||||
</html>
|
||||
`,
|
||||
|
||||
@ -1,3 +1,5 @@
|
||||
import { PackageJSON } from '@ali/lowcode-types';
|
||||
|
||||
import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
|
||||
|
||||
import {
|
||||
@ -6,11 +8,10 @@ import {
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IPackageJSON,
|
||||
IProjectInfo,
|
||||
} from '../../../../../types';
|
||||
|
||||
interface IIceJsPackageJSON extends IPackageJSON {
|
||||
interface IIceJsPackageJSON extends PackageJSON {
|
||||
ideMode: {
|
||||
name: string;
|
||||
};
|
||||
|
||||
@ -39,7 +39,7 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
children: [
|
||||
${ir.routes
|
||||
.map(
|
||||
route => `
|
||||
(route) => `
|
||||
{
|
||||
path: '${route.path}',
|
||||
component: ${route.componentName},
|
||||
@ -54,6 +54,7 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
],
|
||||
});
|
||||
@ -69,6 +70,7 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileMainContent,
|
||||
],
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'README',
|
||||
'md',
|
||||
`
|
||||
|
||||
@ -1,17 +1,17 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
'abc',
|
||||
'json',
|
||||
`
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
return [
|
||||
[],
|
||||
{
|
||||
name: 'abc',
|
||||
ext: 'json',
|
||||
content: `
|
||||
{
|
||||
"type": "ice-app",
|
||||
"builder": "@ali/builder-ice-app"
|
||||
}
|
||||
`,
|
||||
);
|
||||
|
||||
return [[], file];
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
@ -1,11 +1,12 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
'build',
|
||||
'json',
|
||||
`
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
return [
|
||||
[],
|
||||
{
|
||||
name: 'build',
|
||||
ext: 'json',
|
||||
content: `
|
||||
{
|
||||
"entry": "src/app.js",
|
||||
"plugins": [
|
||||
@ -26,8 +27,7 @@ export default function getFile(): [string[], IResultFile] {
|
||||
"@ali/build-plugin-ice-def"
|
||||
]
|
||||
}
|
||||
`,
|
||||
);
|
||||
|
||||
return [[], file];
|
||||
`,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.editorconfig',
|
||||
'',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.eslintignore',
|
||||
'',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.eslintrc',
|
||||
'js',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.gitignore',
|
||||
'',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'jsconfig',
|
||||
'json',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.prettierignore',
|
||||
'',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.prettierrc',
|
||||
'js',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'index',
|
||||
'jsx',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'index',
|
||||
'module.scss',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'index',
|
||||
'jsx',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'index',
|
||||
'module.scss',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'index',
|
||||
'jsx',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'index',
|
||||
'jsx',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'menuConfig',
|
||||
'js',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.stylelintignore',
|
||||
'',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.stylelintrc',
|
||||
'js',
|
||||
`
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'tsconfig',
|
||||
'json',
|
||||
`
|
||||
|
||||
@ -1,8 +1,7 @@
|
||||
import ResultDir from '../../../../../model/ResultDir';
|
||||
import {
|
||||
IProjectTemplate,
|
||||
IResultDir,
|
||||
} from '../../../../../types';
|
||||
import { ResultDir } from '@ali/lowcode-types';
|
||||
import { IProjectTemplate } from '../../../../../types';
|
||||
|
||||
import { createResultDir } from '../../../../../utils/resultHelper';
|
||||
import { runFileGenerator } from '../../../../../utils/templateHelper';
|
||||
|
||||
import file12 from './files/abc.json';
|
||||
@ -68,8 +67,8 @@ const icejsTemplate: IProjectTemplate = {
|
||||
},
|
||||
},
|
||||
|
||||
generateTemplate(): IResultDir {
|
||||
const root = new ResultDir('.');
|
||||
generateTemplate(): ResultDir {
|
||||
const root = createResultDir('.');
|
||||
|
||||
runFileGenerator(root, file1);
|
||||
runFileGenerator(root, file2);
|
||||
|
||||
@ -0,0 +1,19 @@
|
||||
import template from './template';
|
||||
import entry from './plugins/entry';
|
||||
import appConfig from './plugins/appConfig';
|
||||
import buildConfig from './plugins/buildConfig';
|
||||
import entryDocument from './plugins/entryDocument';
|
||||
import globalStyle from './plugins/globalStyle';
|
||||
import packageJSON from './plugins/packageJSON';
|
||||
|
||||
export default {
|
||||
template,
|
||||
plugins: {
|
||||
appConfig,
|
||||
buildConfig,
|
||||
entry,
|
||||
entryDocument,
|
||||
globalStyle,
|
||||
packageJSON,
|
||||
},
|
||||
};
|
||||
@ -0,0 +1,46 @@
|
||||
import changeCase from 'change-case';
|
||||
import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IParseResult,
|
||||
} from '../../../../../types';
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
const ir = next.ir as IParseResult;
|
||||
|
||||
const routes = ir.globalRouter?.routes?.map((route) => ({
|
||||
path: route.path,
|
||||
source: `pages/${changeCase.pascalCase(route.fileName)}/index`,
|
||||
})) || [{ path: '/', source: 'pages/Home/index' }];
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSON,
|
||||
name: COMMON_CHUNK_NAME.CustomContent,
|
||||
content: `
|
||||
{
|
||||
"routes": ${JSON.stringify(routes, null, 2)},
|
||||
"window": {
|
||||
"title": ${JSON.stringify(ir.project?.meta?.title || ir.project?.meta?.name || '')}
|
||||
}
|
||||
}
|
||||
`,
|
||||
linkAfter: [],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
@ -0,0 +1,53 @@
|
||||
import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IParseResult,
|
||||
} from '../../../../../types';
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
const ir = next.ir as IParseResult;
|
||||
// TODO: miniAppBuildType 这个东西是不是不应该在 schema 里面，而是应该由 plugin 的构造参数传入
|
||||
const miniAppBuildType = ir.project?.config?.miniAppBuildType;
|
||||
|
||||
const buildCfg = {
|
||||
inlineStyle: false,
|
||||
plugins: [
|
||||
[
|
||||
'build-plugin-rax-app',
|
||||
{
|
||||
targets: ['web', 'miniapp'],
|
||||
miniapp: miniAppBuildType
|
||||
? {
|
||||
buildType: miniAppBuildType,
|
||||
}
|
||||
: undefined,
|
||||
},
|
||||
],
|
||||
'@ali/build-plugin-rax-app-def',
|
||||
],
|
||||
};
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSON,
|
||||
name: COMMON_CHUNK_NAME.CustomContent,
|
||||
content: JSON.stringify(buildCfg, null, 2) + '\n',
|
||||
linkAfter: [],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
@ -0,0 +1,54 @@
|
||||
import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IProjectInfo,
|
||||
} from '../../../../../types';
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
const ir = next.ir as IProjectInfo;
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
name: COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
content: `
|
||||
import { runApp } from 'rax-app';
|
||||
import appConfig from './app.json';
|
||||
|
||||
import './global.scss';
|
||||
`,
|
||||
linkAfter: [],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
name: COMMON_CHUNK_NAME.FileMainContent,
|
||||
content: `
|
||||
runApp(appConfig);
|
||||
`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
@ -0,0 +1,59 @@
|
||||
import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IProjectInfo,
|
||||
} from '../../../../../types';
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
const ir = next.ir as IProjectInfo;
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JSX,
|
||||
name: COMMON_CHUNK_NAME.CustomContent,
|
||||
content: `
|
||||
import { createElement } from 'rax';
|
||||
import { Root, Style, Script } from 'rax-document';
|
||||
|
||||
function Document() {
|
||||
return (
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,viewport-fit=cover"
|
||||
/>
|
||||
<title>${ir?.meta?.name || 'Rax App'}</title>
|
||||
<Style />
|
||||
</head>
|
||||
<body>
|
||||
{/* root container */}
|
||||
<Root />
|
||||
<Script />
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
|
||||
export default Document;
|
||||
`,
|
||||
linkAfter: [],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
@ -0,0 +1,64 @@
|
||||
import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IProjectInfo,
|
||||
} from '../../../../../types';
|
||||
|
||||
export type GlobalStylePluginConfig = {
|
||||
fileType: string;
|
||||
};
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<GlobalStylePluginConfig> = (
|
||||
config?: Partial<GlobalStylePluginConfig>,
|
||||
) => {
|
||||
const cfg: GlobalStylePluginConfig = {
|
||||
fileType: FileType.SCSS,
|
||||
...config,
|
||||
};
|
||||
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
const ir = next.ir as IProjectInfo;
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: COMMON_CHUNK_NAME.StyleDepsImport,
|
||||
content: ``,
|
||||
linkAfter: [],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: COMMON_CHUNK_NAME.StyleCssContent,
|
||||
content: `
|
||||
body {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
`,
|
||||
linkAfter: [COMMON_CHUNK_NAME.StyleDepsImport],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: cfg.fileType,
|
||||
name: COMMON_CHUNK_NAME.StyleCssContent,
|
||||
content: ir.css || '',
|
||||
linkAfter: [COMMON_CHUNK_NAME.StyleDepsImport],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
@ -0,0 +1,115 @@
|
||||
import { NpmInfo, PackageJSON } from '@ali/lowcode-types';
|
||||
import { COMMON_CHUNK_NAME } from '../../../../../const/generator';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
ChunkType,
|
||||
FileType,
|
||||
ICodeStruct,
|
||||
IProjectInfo,
|
||||
} from '../../../../../types';
|
||||
import { isNpmInfo } from '../../../../../utils/schema';
|
||||
import { calcCompatibleVersion } from '../../../../../utils/version';
|
||||
|
||||
const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
const plugin: BuilderComponentPlugin = async (pre: ICodeStruct) => {
|
||||
const next: ICodeStruct = {
|
||||
...pre,
|
||||
};
|
||||
|
||||
const ir = next.ir as IProjectInfo;
|
||||
|
||||
const npmDeps = getNpmDependencies(ir);
|
||||
|
||||
const packageJson: PackageJSON = {
|
||||
name: '@ali/rax-app-demo',
|
||||
private: true,
|
||||
version: '1.0.0',
|
||||
scripts: {
|
||||
build: 'build-scripts build',
|
||||
start: 'build-scripts start',
|
||||
lint: 'eslint --ext .js --ext .jsx ./',
|
||||
},
|
||||
dependencies: {
|
||||
'@ali/lowcode-datasource-engine': '*',
|
||||
// TODO: 如何动态获取下面这些依赖？
|
||||
'@ali/lowcode-datasource-url-params-handler': '*',
|
||||
'@ali/lowcode-datasource-fetch-handler': '*',
|
||||
'@ali/lowcode-datasource-mtop-handler': '*',
|
||||
'@ali/lowcode-datasource-mopen-handler': '*',
|
||||
'universal-env': '^3.2.0',
|
||||
'intl-messageformat': '^9.3.6',
|
||||
rax: '^1.1.0',
|
||||
'rax-app': '^2.0.0',
|
||||
'rax-document': '^0.1.0',
|
||||
...npmDeps.reduce(
|
||||
(acc, npm) => ({
|
||||
...acc,
|
||||
[npm.package]: npm.version || '*',
|
||||
}),
|
||||
{} as Record<string, string>,
|
||||
),
|
||||
},
|
||||
devDependencies: {
|
||||
'build-plugin-rax-app': '^5.0.0',
|
||||
'@alib/build-scripts': '^0.1.0',
|
||||
'@typescript-eslint/eslint-plugin': '^2.11.0',
|
||||
'@typescript-eslint/parser': '^2.11.0',
|
||||
'babel-eslint': '^10.0.3',
|
||||
eslint: '^6.8.0',
|
||||
'eslint-config-rax': '^0.1.0',
|
||||
'eslint-plugin-import': '^2.20.0',
|
||||
'eslint-plugin-module': '^0.1.0',
|
||||
'eslint-plugin-react': '^7.18.0',
|
||||
'@ali/build-plugin-rax-app-def': '^1.0.0',
|
||||
},
|
||||
};
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.JSON,
|
||||
fileType: FileType.JSON,
|
||||
name: COMMON_CHUNK_NAME.FileMainContent,
|
||||
content: packageJson,
|
||||
linkAfter: [],
|
||||
});
|
||||
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
};
|
||||
|
||||
export default pluginFactory;
|
||||
|
||||
function getNpmDependencies(project: IProjectInfo): NpmInfo[] {
|
||||
const npmDeps: NpmInfo[] = [];
|
||||
const npmNameToPkgMap = new Map<string, NpmInfo>();
|
||||
|
||||
const allDeps = project.packages;
|
||||
|
||||
allDeps.forEach((dep) => {
|
||||
if (!isNpmInfo(dep)) {
|
||||
return;
|
||||
}
|
||||
|
||||
const existing = npmNameToPkgMap.get(dep.package);
|
||||
if (!existing) {
|
||||
npmNameToPkgMap.set(dep.package, dep);
|
||||
npmDeps.push(dep);
|
||||
return;
|
||||
}
|
||||
|
||||
if (existing.version !== dep.version) {
|
||||
try {
|
||||
npmNameToPkgMap.set(dep.package, {
|
||||
...existing,
|
||||
version: calcCompatibleVersion(existing.version, dep.version),
|
||||
});
|
||||
} catch (e) {
|
||||
throw new Error(`Cannot find compatible version for ${dep.package}. Detail: ${e.message}`);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return npmDeps;
|
||||
}
|
||||
@ -0,0 +1,27 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'README',
|
||||
'md',
|
||||
`# @ali/rax-component-demo
|
||||
|
||||
## Getting Started
|
||||
|
||||
### \`npm run start\`
|
||||
|
||||
Runs the app in development mode.
|
||||
|
||||
Open [http://localhost:9999](http://localhost:9999) to view it in the browser.
|
||||
|
||||
The page will reload if you make edits.
|
||||
|
||||
### \`npm run build\`
|
||||
|
||||
Builds the app for production to the \`build\` folder.
|
||||
`,
|
||||
);
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
@ -0,0 +1,19 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'abc',
|
||||
'json',
|
||||
`{
|
||||
"type": "rax",
|
||||
"builder": "@ali/builder-rax-v1",
|
||||
"info": {
|
||||
"raxVersion": "1.x"
|
||||
}
|
||||
}
|
||||
`,
|
||||
);
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
@ -0,0 +1,24 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'build',
|
||||
'json',
|
||||
`{
|
||||
"inlineStyle": false,
|
||||
"plugins": [
|
||||
[
|
||||
"build-plugin-rax-app",
|
||||
{
|
||||
"targets": ["web", "miniapp"]
|
||||
}
|
||||
],
|
||||
"@ali/build-plugin-rax-app-def"
|
||||
]
|
||||
}
|
||||
`,
|
||||
);
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
@ -0,0 +1,25 @@
|
||||
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.editorconfig',
|
||||
'',
|
||||
`# http://editorconfig.org
|
||||
root = true
|
||||
|
||||
[*]
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
charset = utf-8
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
||||
|
||||
[*.md]
|
||||
trim_trailing_whitespace = false
|
||||
`,
|
||||
);
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
@ -0,0 +1,23 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.eslintignore',
|
||||
'',
|
||||
`# 忽略目录
|
||||
build/
|
||||
tests/
|
||||
demo/
|
||||
|
||||
# node 覆盖率文件
|
||||
coverage/
|
||||
|
||||
# 忽略文件
|
||||
**/*-min.js
|
||||
**/*.min.js
|
||||
`,
|
||||
);
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
@ -0,0 +1,16 @@
|
||||
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.eslintrc',
|
||||
'js',
|
||||
`module.exports = {
|
||||
extends: ['rax'],
|
||||
};
|
||||
`,
|
||||
);
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
@ -0,0 +1,29 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.gitignore',
|
||||
'',
|
||||
`# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||
|
||||
*~
|
||||
*.swp
|
||||
*.log
|
||||
|
||||
.DS_Store
|
||||
.idea/
|
||||
.temp/
|
||||
|
||||
build/
|
||||
dist/
|
||||
lib/
|
||||
coverage/
|
||||
node_modules/
|
||||
|
||||
template.yml
|
||||
`,
|
||||
);
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
@ -0,0 +1,78 @@
|
||||
import { ResultDir } from '@ali/lowcode-types';
|
||||
import { IProjectTemplate } from '../../../../../types';
|
||||
|
||||
import { runFileGenerator } from '../../../../../utils/templateHelper';
|
||||
import { createResultDir } from '../../../../../utils/resultHelper';
|
||||
|
||||
import file0 from './files/editorconfig';
|
||||
import file1 from './files/eslintignore';
|
||||
import file2 from './files/eslintrc.js';
|
||||
import file3 from './files/gitignore';
|
||||
import file4 from './files/README.md';
|
||||
import file5 from './files/abc.json';
|
||||
|
||||
const raxAppTemplate: IProjectTemplate = {
|
||||
slots: {
|
||||
components: {
|
||||
path: ['src', 'components'],
|
||||
},
|
||||
pages: {
|
||||
path: ['src', 'pages'],
|
||||
},
|
||||
router: {
|
||||
path: ['src'],
|
||||
fileName: 'router',
|
||||
},
|
||||
entry: {
|
||||
path: ['src'],
|
||||
fileName: 'app',
|
||||
},
|
||||
appConfig: {
|
||||
path: ['src'],
|
||||
fileName: 'app',
|
||||
},
|
||||
buildConfig: {
|
||||
path: [],
|
||||
fileName: 'build',
|
||||
},
|
||||
constants: {
|
||||
path: ['src'],
|
||||
fileName: 'constants',
|
||||
},
|
||||
utils: {
|
||||
path: ['src'],
|
||||
fileName: 'utils',
|
||||
},
|
||||
i18n: {
|
||||
path: ['src'],
|
||||
fileName: 'i18n',
|
||||
},
|
||||
globalStyle: {
|
||||
path: ['src'],
|
||||
fileName: 'global',
|
||||
},
|
||||
htmlEntry: {
|
||||
path: ['src', 'document'],
|
||||
fileName: 'index',
|
||||
},
|
||||
packageJSON: {
|
||||
path: [],
|
||||
fileName: 'package',
|
||||
},
|
||||
},
|
||||
|
||||
generateTemplate(): ResultDir {
|
||||
const root = createResultDir('.');
|
||||
|
||||
runFileGenerator(root, file0);
|
||||
runFileGenerator(root, file1);
|
||||
runFileGenerator(root, file2);
|
||||
runFileGenerator(root, file3);
|
||||
runFileGenerator(root, file4);
|
||||
runFileGenerator(root, file5);
|
||||
|
||||
return root;
|
||||
},
|
||||
};
|
||||
|
||||
export default raxAppTemplate;
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.editorconfig',
|
||||
'',
|
||||
`
|
||||
@ -29,4 +28,3 @@ trim_trailing_whitespace = false
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.eslintignore',
|
||||
'',
|
||||
`
|
||||
@ -23,4 +23,3 @@ packages/solution
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.gitignore',
|
||||
'',
|
||||
`
|
||||
@ -54,4 +53,3 @@ Thumbs.db
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'.prettierrc',
|
||||
'',
|
||||
`
|
||||
@ -19,4 +18,3 @@ export default function getFile(): [string[], IResultFile] {
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'README',
|
||||
'md',
|
||||
`
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'abc',
|
||||
'json',
|
||||
`
|
||||
@ -25,4 +24,3 @@ export default function getFile(): [string[], IResultFile] {
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'build',
|
||||
'json',
|
||||
`
|
||||
@ -29,4 +28,3 @@ export default function getFile(): [string[], IResultFile] {
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'package',
|
||||
'json',
|
||||
`
|
||||
@ -63,4 +62,3 @@ export default function getFile(): [string[], IResultFile] {
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'index',
|
||||
'html',
|
||||
`
|
||||
@ -48,4 +47,3 @@ export default function getFile(): [string[], IResultFile] {
|
||||
|
||||
return [['public'], file];
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'app',
|
||||
'ts',
|
||||
`
|
||||
@ -72,6 +71,5 @@ export default {
|
||||
`,
|
||||
);
|
||||
|
||||
return [['src','config'], file];
|
||||
return [['src', 'config'], file];
|
||||
}
|
||||
|
||||
@ -1,15 +1,14 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'components',
|
||||
'ts',
|
||||
`
|
||||
/**
|
||||
* 乐高组件
|
||||
*/
|
||||
*/
|
||||
import Div from '@ali/vc-div/build/view';
|
||||
import Text from '@ali/vc-text/build/view';
|
||||
import Slot from '@ali/vc-slot/build/view';
|
||||
@ -38,6 +37,5 @@ export default componentsMap;
|
||||
`,
|
||||
);
|
||||
|
||||
return [['src','config'], file];
|
||||
return [['src', 'config'], file];
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'utils',
|
||||
'ts',
|
||||
`
|
||||
@ -24,6 +23,5 @@ export default {
|
||||
`,
|
||||
);
|
||||
|
||||
return [['src','config'], file];
|
||||
return [['src', 'config'], file];
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'index',
|
||||
'ts',
|
||||
`
|
||||
@ -98,4 +97,3 @@ app.run();
|
||||
|
||||
return [['src'], file];
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'router',
|
||||
'ts',
|
||||
`
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import { ResultFile } from '@ali/lowcode-types';
|
||||
import { createResultFile } from '../../../../../../utils/resultHelper';
|
||||
|
||||
import ResultFile from '../../../../../../model/ResultFile';
|
||||
import { IResultFile } from '../../../../../../types';
|
||||
|
||||
export default function getFile(): [string[], IResultFile] {
|
||||
const file = new ResultFile(
|
||||
export default function getFile(): [string[], ResultFile] {
|
||||
const file = createResultFile(
|
||||
'tsconfig',
|
||||
'json',
|
||||
`
|
||||
@ -50,4 +49,3 @@ export default function getFile(): [string[], IResultFile] {
|
||||
|
||||
return [[], file];
|
||||
}
|
||||
|
||||
@ -1,8 +1,6 @@
|
||||
import ResultDir from '../../../../../model/ResultDir';
|
||||
import {
|
||||
IProjectTemplate,
|
||||
IResultDir,
|
||||
} from '../../../../../types';
|
||||
import { ResultDir } from '@ali/lowcode-types';
|
||||
import { IProjectTemplate } from '../../../../../types';
|
||||
import { createResultDir } from '../../../../../utils/resultHelper';
|
||||
import { runFileGenerator } from '../../../../../utils/templateHelper';
|
||||
|
||||
import file1 from './files/abc.json';
|
||||
@ -28,8 +26,8 @@ const icejsTemplate: IProjectTemplate = {
|
||||
},
|
||||
},
|
||||
|
||||
generateTemplate(): IResultDir {
|
||||
const root = new ResultDir('.');
|
||||
generateTemplate(): ResultDir {
|
||||
const root = createResultDir('.');
|
||||
|
||||
runFileGenerator(root, file1);
|
||||
runFileGenerator(root, file2);
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { COMMON_CHUNK_NAME } from '../../const/generator';
|
||||
import { generateCompositeType } from '../../utils/compositeType';
|
||||
|
||||
import {
|
||||
BuilderComponentPlugin,
|
||||
BuilderComponentPluginFactory,
|
||||
@ -16,51 +16,73 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
};
|
||||
|
||||
const ir = next.ir as IProjectInfo;
|
||||
if (ir.i18n) {
|
||||
const i18nStr = generateCompositeType(ir.i18n);
|
||||
const i18nStr = ir.i18n ? JSON.stringify(ir.i18n, null, 2) : '{}';
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
name: COMMON_CHUNK_NAME.FileMainContent,
|
||||
content: `
|
||||
const i18nConfig = ${i18nStr};
|
||||
let locale = 'en_US';
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
name: COMMON_CHUNK_NAME.FileMainContent,
|
||||
content: `
|
||||
import IntlMessageFormat from 'intl-messageformat';
|
||||
|
||||
const changeLocale = (target) => {
|
||||
locale = target;
|
||||
};
|
||||
const i18nConfig = ${i18nStr};
|
||||
|
||||
const i18n = key => i18nConfig && i18nConfig[locale] && i18nConfig[locale][key] || '';
|
||||
`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
],
|
||||
});
|
||||
let locale = 'en-US';
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
name: COMMON_CHUNK_NAME.FileExport,
|
||||
content: `
|
||||
export {
|
||||
changeLocale,
|
||||
i18n,
|
||||
};
|
||||
`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
COMMON_CHUNK_NAME.FileMainContent,
|
||||
],
|
||||
});
|
||||
}
|
||||
const getLocale = () => locale;
|
||||
|
||||
const setLocale = (target) => {
|
||||
locale = target;
|
||||
};
|
||||
|
||||
const i18nFormat = ({ id, defaultMessage }, variables) => {
|
||||
const msg = i18nConfig && i18nConfig[locale] && i18nConfig[locale][id] || defaultMessage;
|
||||
if (msg == null) {
|
||||
console.warn('[i18n]: unknown message id: %o (locale=%o)', id, locale);
|
||||
return \`\${id}\`;
|
||||
}
|
||||
|
||||
if (!variables || !variables.length) {
|
||||
return msg;
|
||||
}
|
||||
|
||||
return new IntlMessageFormat(msg, locale).format(variables);
|
||||
}
|
||||
|
||||
const i18n = id => {
|
||||
return i18nFormat({ id });
|
||||
};
|
||||
`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
],
|
||||
});
|
||||
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
name: COMMON_CHUNK_NAME.FileExport,
|
||||
content: `
|
||||
export {
|
||||
getLocale,
|
||||
setLocale,
|
||||
i18n,
|
||||
i18nFormat,
|
||||
};
|
||||
`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
COMMON_CHUNK_NAME.FileMainContent,
|
||||
],
|
||||
});
|
||||
return next;
|
||||
};
|
||||
return plugin;
|
||||
|
||||
@ -28,24 +28,26 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
COMMON_CHUNK_NAME.FileMainContent,
|
||||
],
|
||||
});
|
||||
|
||||
ir.utils.forEach(util => {
|
||||
ir.utils.forEach((util) => {
|
||||
if (util.type === 'function') {
|
||||
next.chunks.push({
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
name: COMMON_CHUNK_NAME.FileVarDefine,
|
||||
content: `
|
||||
const ${util.name} = ${util.content};
|
||||
const ${util.name} = ${util.content.value};
|
||||
`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
],
|
||||
});
|
||||
}
|
||||
@ -54,12 +56,11 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
type: ChunkType.STRING,
|
||||
fileType: FileType.JS,
|
||||
name: COMMON_CHUNK_NAME.FileExport,
|
||||
content: `
|
||||
${util.name},
|
||||
`,
|
||||
content: `${util.name},`,
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
COMMON_CHUNK_NAME.FileMainContent,
|
||||
@ -77,6 +78,7 @@ const pluginFactory: BuilderComponentPluginFactory<unknown> = () => {
|
||||
linkAfter: [
|
||||
COMMON_CHUNK_NAME.ExternalDepsImport,
|
||||
COMMON_CHUNK_NAME.InternalDepsImport,
|
||||
COMMON_CHUNK_NAME.ImportAliasDefine,
|
||||
COMMON_CHUNK_NAME.FileVarDefine,
|
||||
COMMON_CHUNK_NAME.FileUtilDefine,
|
||||
COMMON_CHUNK_NAME.FileMainContent,
|
||||
|
||||
@ -21,6 +21,8 @@ const factory: PostProcessorFactory<ProcessorConfig> = (config?: ProcessorConfig
|
||||
parser = 'babel';
|
||||
} else if (fileType === 'ts' || fileType === 'tsx') {
|
||||
parser = 'typescript';
|
||||
} else if (fileType === 'json') {
|
||||
parser = 'json';
|
||||
} else if (PARSERS.indexOf(fileType) >= 0) {
|
||||
parser = fileType as prettier.BuiltInParserName;
|
||||
} else if (cfg.customFileTypeParser[fileType]){
|
||||
|
||||
@ -1,16 +1,14 @@
|
||||
import {
|
||||
IResultDir,
|
||||
PublisherFactory,
|
||||
IPublisher,
|
||||
IPublisherFactoryParams,
|
||||
PublisherError,
|
||||
} from '../../types';
|
||||
import { writeFolder } from './utils';
|
||||
import * as defaultFs from 'fs';
|
||||
|
||||
import { ResultDir } from '@ali/lowcode-types';
|
||||
import { PublisherFactory, IPublisher, IPublisherFactoryParams, PublisherError } from '../../types';
|
||||
import { writeFolder, IFileSystem } from './utils';
|
||||
|
||||
export interface IDiskFactoryParams extends IPublisherFactoryParams {
|
||||
outputPath?: string;
|
||||
projectSlug?: string;
|
||||
createProjectFolder?: boolean;
|
||||
fs?: IFileSystem;
|
||||
}
|
||||
|
||||
export interface IDiskPublisher extends IPublisher<IDiskFactoryParams, string> {
|
||||
@ -18,19 +16,19 @@ export interface IDiskPublisher extends IPublisher<IDiskFactoryParams, string> {
|
||||
setOutputPath: (path: string) => void;
|
||||
}
|
||||
|
||||
export const createDiskPublisher: PublisherFactory<
|
||||
IDiskFactoryParams,
|
||||
IDiskPublisher
|
||||
> = (params: IDiskFactoryParams = {}): IDiskPublisher => {
|
||||
export const createDiskPublisher: PublisherFactory<IDiskFactoryParams, IDiskPublisher> = (
|
||||
params: IDiskFactoryParams = {},
|
||||
): IDiskPublisher => {
|
||||
let { project, outputPath = './' } = params;
|
||||
const { fs = defaultFs } = params;
|
||||
|
||||
const getProject = (): IResultDir => {
|
||||
const getProject = (): ResultDir => {
|
||||
if (!project) {
|
||||
throw new PublisherError('Missing Project');
|
||||
}
|
||||
return project;
|
||||
};
|
||||
const setProject = (projectToSet: IResultDir): void => {
|
||||
const setProject = (projectToSet: ResultDir): void => {
|
||||
project = projectToSet;
|
||||
};
|
||||
|
||||
@ -49,19 +47,14 @@ export const createDiskPublisher: PublisherFactory<
|
||||
|
||||
const projectOutputPath = options.outputPath || outputPath;
|
||||
const overrideProjectSlug = options.projectSlug || params.projectSlug;
|
||||
const createProjectFolder =
|
||||
options.createProjectFolder || params.createProjectFolder;
|
||||
const createProjectFolder = options.createProjectFolder || params.createProjectFolder;
|
||||
|
||||
if (overrideProjectSlug) {
|
||||
projectToPublish.name = overrideProjectSlug;
|
||||
}
|
||||
|
||||
try {
|
||||
await writeFolder(
|
||||
projectToPublish,
|
||||
projectOutputPath,
|
||||
createProjectFolder,
|
||||
);
|
||||
await writeFolder(projectToPublish, projectOutputPath, createProjectFolder, fs);
|
||||
return { success: true, payload: projectOutputPath };
|
||||
} catch (error) {
|
||||
throw new PublisherError(error);
|
||||
|
||||
@ -1,58 +1,53 @@
|
||||
import { existsSync, mkdir, writeFile } from 'fs';
|
||||
import * as systemFs from 'fs';
|
||||
import { join } from 'path';
|
||||
import { ResultDir, ResultFile } from '@ali/lowcode-types';
|
||||
|
||||
import { IResultDir, IResultFile } from '../../types';
|
||||
export interface IFileSystem {
|
||||
existsSync: typeof systemFs.existsSync;
|
||||
mkdir: typeof systemFs.mkdir;
|
||||
writeFile: typeof systemFs.writeFile;
|
||||
}
|
||||
|
||||
export const writeFolder = async (
|
||||
folder: IResultDir,
|
||||
folder: ResultDir,
|
||||
currentPath: string,
|
||||
createProjectFolder = true,
|
||||
fs: IFileSystem = systemFs,
|
||||
): Promise<void> => {
|
||||
const { name, files, dirs } = folder;
|
||||
|
||||
const folderPath = createProjectFolder
|
||||
? join(currentPath, name)
|
||||
: currentPath;
|
||||
const folderPath = createProjectFolder ? join(currentPath, name) : currentPath;
|
||||
|
||||
if (!existsSync(folderPath)) {
|
||||
await createDirectory(folderPath);
|
||||
if (!fs.existsSync(folderPath)) {
|
||||
await createDirectory(folderPath, fs);
|
||||
}
|
||||
|
||||
const promises = [
|
||||
writeFilesToFolder(folderPath, files),
|
||||
writeSubFoldersToFolder(folderPath, dirs),
|
||||
];
|
||||
const promises = [writeFilesToFolder(folderPath, files, fs), writeSubFoldersToFolder(folderPath, dirs, fs)];
|
||||
|
||||
await Promise.all(promises);
|
||||
};
|
||||
|
||||
const writeFilesToFolder = async (
|
||||
folderPath: string,
|
||||
files: IResultFile[],
|
||||
): Promise<void> => {
|
||||
const promises = files.map(file => {
|
||||
const writeFilesToFolder = async (folderPath: string, files: ResultFile[], fs: IFileSystem): Promise<void> => {
|
||||
const promises = files.map((file) => {
|
||||
const fileName = file.ext ? `${file.name}.${file.ext}` : file.name;
|
||||
const filePath = join(folderPath, fileName);
|
||||
return writeContentToFile(filePath, file.content);
|
||||
return writeContentToFile(filePath, file.content, 'utf8', fs);
|
||||
});
|
||||
|
||||
await Promise.all(promises);
|
||||
};
|
||||
|
||||
const writeSubFoldersToFolder = async (
|
||||
folderPath: string,
|
||||
subFolders: IResultDir[],
|
||||
): Promise<void> => {
|
||||
const promises = subFolders.map(subFolder => {
|
||||
const writeSubFoldersToFolder = async (folderPath: string, subFolders: ResultDir[], fs: IFileSystem): Promise<void> => {
|
||||
const promises = subFolders.map((subFolder) => {
|
||||
return writeFolder(subFolder, folderPath);
|
||||
});
|
||||
|
||||
await Promise.all(promises);
|
||||
};
|
||||
|
||||
const createDirectory = (pathToDir: string): Promise<void> => {
|
||||
const createDirectory = (pathToDir: string, fs: IFileSystem): Promise<void> => {
|
||||
return new Promise((resolve, reject) => {
|
||||
mkdir(pathToDir, { recursive: true }, err => {
|
||||
fs.mkdir(pathToDir, { recursive: true }, (err) => {
|
||||
err ? reject(err) : resolve();
|
||||
});
|
||||
});
|
||||
@ -61,10 +56,11 @@ const createDirectory = (pathToDir: string): Promise<void> => {
|
||||
const writeContentToFile = (
|
||||
filePath: string,
|
||||
fileContent: string,
|
||||
encoding: string = 'utf8',
|
||||
encoding = 'utf8',
|
||||
fs: IFileSystem,
|
||||
): Promise<void> => {
|
||||
return new Promise((resolve, reject) => {
|
||||
writeFile(filePath, fileContent, encoding, err => {
|
||||
fs.writeFile(filePath, fileContent, encoding, (err) => {
|
||||
err ? reject(err) : resolve();
|
||||
});
|
||||
});
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user