diff --git a/.gitignore b/.gitignore index 215f97b..fc6cd88 100644 --- a/.gitignore +++ b/.gitignore @@ -29,4 +29,4 @@ example/src/.umi-test example/.env.local # eslint -.eslint-error.log \ No newline at end of file +.eslint-error.log diff --git a/mlc_config.json b/mlc_config.json new file mode 100644 index 0000000..cf691cb --- /dev/null +++ b/mlc_config.json @@ -0,0 +1,13 @@ +{ + "ignorePatterns": [ + { + "pattern": "^https?://0.0.0.0:\\d+" + }, + { + "pattern": "^https?://127.0.0.1:\\d+" + }, + { + "pattern": "^https?://localhost:\\d+" + } + ] +} diff --git a/packages/cli/README.md b/packages/cli/README.md index dddb8ab..224ecb2 100644 --- a/packages/cli/README.md +++ b/packages/cli/README.md @@ -1 +1,27 @@ -## iMove-cli \ No newline at end of file +## iMove-cli + +### Install + +```bash +npm i -g @imove/cli +``` + +### Usage + +- 初始化项目,创建 `imove.config.js` + +```bash +imove -i +# OR +imove --init +``` + +- 启动开发服务及编辑器 + +```bash +imove -de +# OR +imove --dev --editor +``` + +浏览器打开 [http://127.0.0.1:3500/](http://127.0.0.1:3500/) diff --git a/packages/cli/index.js b/packages/cli/index.js index 2eea6c2..1fb6e33 100755 --- a/packages/cli/index.js +++ b/packages/cli/index.js @@ -8,13 +8,14 @@ const pkg = require(path.join(__dirname, './package.json')); program .version(pkg.version) .option('-d, --dev', '本地开发') + .option('-e, --editor', '开启编辑器') .option('-i, --init', '初始化配置文件') .parse(process.argv); Object.keys(cmds).forEach((cmd) => { const CmdCtor = cmds[cmd]; - if(program[cmd]) { - const cmdInst = new CmdCtor({config: getConfig()}); + if (program[cmd]) { + const cmdInst = new CmdCtor({ config: getConfig() }); cmdInst.run(); } }); diff --git a/packages/cli/package.json b/packages/cli/package.json index c72d0b3..0137d24 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -11,7 +11,8 @@ "compile" ], "scripts": { - "test": "echo \"Error: no test specified\" && exit 1" + "build:editor": "node src/cmd/editor/build.js", + "postinstall": "npm run build:editor" }, "repository": { "type": "git", @@ -21,11 +22,15 @@ "license": "MIT", "dependencies": { "@imove/compile-code": "^0.1.0", + "@imove/core": "^0.3.0", "body-parser": "^1.19.0", "commander": "^6.0.0", "cors": "^2.8.5", + "esbuild": "^0.12.15", + "esbuild-plugin-less": "^1.0.7", "eventemitter3": "^4.0.7", "express": "^4.17.1", - "fs-extra": "^9.0.1" + "fs-extra": "^9.0.1", + "lowdb": "^1.0.0" } } diff --git a/packages/cli/src/cmd/editor/build.js b/packages/cli/src/cmd/editor/build.js new file mode 100644 index 0000000..828c7f7 --- /dev/null +++ b/packages/cli/src/cmd/editor/build.js @@ -0,0 +1,35 @@ +/* eslint-disable @typescript-eslint/no-var-requires */ +const path = require('path'); +const { lessLoader } = require('esbuild-plugin-less'); + +require('esbuild') + .build({ + bundle: true, + entryPoints: [path.join(__dirname, 'template/app.jsx')], + outfile: path.join(__dirname, 'template/dist/app.bundle.js'), + plugins: [ + // fix import('antd/dist/antd.less') + { + name: 'resolve-antd-dist-less', + setup: (build) => { + build.onResolve( + { filter: /antd\/dist\/antd\.less$/, namespace: 'file' }, + () => { + return { + path: '', + watchFiles: undefined, + }; + }, + ); + }, + }, + // less + lessLoader({ + javascriptEnabled: true, + }), + ], + }) + .then(() => { + console.log('imove editor builded'); + }) + .catch(() => process.exit(1)); diff --git a/packages/cli/src/cmd/editor/index.js b/packages/cli/src/cmd/editor/index.js new file mode 100644 index 0000000..4101635 --- /dev/null +++ b/packages/cli/src/cmd/editor/index.js @@ -0,0 +1,79 @@ +/* eslint-disable @typescript-eslint/no-var-requires */ +const fs = require('fs-extra'); +const path = require('path'); +const low = require('lowdb'); +const FileSync = require('lowdb/adapters/FileSync'); +const express = require('express'); +const Base = require('../base'); +const { createServer } = require('../../utils/server'); + +class Editor extends Base { + constructor(...args) { + super(...args); + if (!this.dbFile) { + fs.ensureDirSync(this.outputPath); + this.dbFile = path.join(this.outputPath, 'db.json'); + } + // make sure dbFile existed + fs.createFileSync(this.dbFile); + + const adapter = new FileSync(this.dbFile); + this.db = low(adapter); + } + + get projectName() { + const { projectName = 'default' } = this.config || ''; + return projectName; + } + + get outputPath() { + const { outputPath } = this.config || ''; + return outputPath; + } + + get dbFile() { + const dbFile = this._dbFile || (this.config || '').dbFile; + return dbFile; + } + + set dbFile(val) { + this._dbFile = val; + } + + queryGraph(req, res) { + const data = this.db.get(this.projectName).value() || []; + res.send({ status: 200, code: 0, success: true, data: { cells: data } }); + } + + modifyGraph(req, res) { + const { actions = [] } = req.body; + const projectData = this.db.get(this.projectName).value() || []; + actions.forEach((action) => { + const { data, actionType } = action; + if (actionType === 'create') { + projectData.push(data); + } else if (actionType === 'update') { + const foundIdx = projectData.findIndex((item) => item.id === data.id); + if (foundIdx > -1) { + projectData[foundIdx] = data; + } + } else if (actionType === 'remove') { + const foundIdx = projectData.findIndex((item) => item.id === data.id); + if (foundIdx > -1) { + projectData.splice(foundIdx, 1); + } + } + }); + this.db.set(this.projectName, projectData).write(); + res.send({ status: 200, code: 0, success: true, data: [] }); + } + + run() { + const server = createServer(); + server.use(express.static(path.join(__dirname, './template'))); + server.post('/api/queryGraph', this.queryGraph.bind(this)); + server.post('/api/modifyGraph', this.modifyGraph.bind(this)); + } +} + +module.exports = Editor; diff --git a/packages/cli/src/cmd/editor/template/app.jsx b/packages/cli/src/cmd/editor/template/app.jsx new file mode 100644 index 0000000..f2250a0 --- /dev/null +++ b/packages/cli/src/cmd/editor/template/app.jsx @@ -0,0 +1,5 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import IMove from '@imove/core'; + +ReactDOM.render(, document.getElementById('root')); diff --git a/packages/cli/src/cmd/editor/template/index.html b/packages/cli/src/cmd/editor/template/index.html new file mode 100644 index 0000000..ef0d12f --- /dev/null +++ b/packages/cli/src/cmd/editor/template/index.html @@ -0,0 +1,13 @@ + + + + + + iMove Editor + + + +
+ + + diff --git a/packages/cli/src/cmd/index.js b/packages/cli/src/cmd/index.js index ffe5e78..f901674 100644 --- a/packages/cli/src/cmd/index.js +++ b/packages/cli/src/cmd/index.js @@ -1,7 +1,9 @@ const Dev = require('./dev'); const Init = require('./init'); +const Editor = require('./editor'); module.exports = { dev: Dev, init: Init, + editor: Editor, }; diff --git a/packages/cli/src/utils/server/index.js b/packages/cli/src/utils/server/index.js index 3dec508..3cd7a1e 100644 --- a/packages/cli/src/utils/server/index.js +++ b/packages/cli/src/utils/server/index.js @@ -1,8 +1,15 @@ const express = require('express'); const bodyParser = require('body-parser'); +const cachedServer = {}; + const createServer = (port = 3500) => { + if (cachedServer[port]) { + return cachedServer[port]; + } const app = express(); + cachedServer[port] = app; + app.use(bodyParser.json({ limit: '50mb' })); app.use(bodyParser.urlencoded({ extended: false })); app.use((req, res, next) => {