yystopf
/
inula
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'gitee/api2/for' into dev-04-15 

# Conflicts:
#	demos/benchmark/src/main.jsx
#	demos/v2/src/App.view.tsx
#	packages/transpiler/babel-preset-inula-next/CHANGELOG.md
#	packages/transpiler/babel-preset-inula-next/package.json
#	packages/transpiler/class-transformer/package.json
#	packages/transpiler/class-transformer/src/pluginProvider.ts
#	packages/transpiler/vite-plugin-inula-next/CHANGELOG.md
#	packages/transpiler/vite-plugin-inula-next/package.json
This commit is contained in:
Hoikan 2024-04-15 11:51:44 +08:00
parent f447bb8989 4608422c0a
commit 37d6ba1033
9 changed files with 113 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
demos/v2/index.html
View File

@ -7,6 +7,6 @@
</head> </head>
<body> <body>
<div id="main"></div> <div id="main"></div>
<script type="module" src="/src/App.view.tsx"></script> <script type="module" src="/src/App.tsx"></script>
</body> </body>
</html> </html>

71
demos/v2/src/App.view.tsx
View File

@ -16,9 +16,7 @@ import {
} from '@openinula/next'; } from '@openinula/next';
// @ts-ignore // @ts-ignore
function Button({ children: content, onClick }) { function Button({ children, onClick }) {
console.log(content);
return ( return (
<button <button
onClick={onClick} onClick={onClick}
@ -31,10 +29,11 @@ function Button({ children: content, onClick }) {
borderRadius: '4px', borderRadius: '4px',
}} }}
> >
{content} {children}
</button> </button>
); );
} }
function ArrayModification() { function ArrayModification() {
const arr = []; const arr = [];
willMount(() => {}); willMount(() => {});
@ -47,9 +46,69 @@ function ArrayModification() {
); );
} }
function Counter() {
let count = 0;
const doubleCount = count * 2; // 当count变化时，doubleCount自动更新
// 当count变化时，watch会自动执行
watch(() => {
uploadToServer(count);
console.log(`count has changed: ${count}`);
});
// 只有在init的时候执行一次
console.log(`Counter willMount with count ${count}`);
// 在elements被挂载到DOM之后执行
didMount(() => {
console.log(`Counter didMount with count ${count}`);
});
return (
<section>
count: {count}, double is: {doubleCount}
<button onClick={() => count++}>Add</button>
</section>
);
}
function Counter() {
let count = 0;
const doubleCount = count * 2; // 当count变化时，doubleCount自动更新
uploadToServer(count); // 当count变化时，uploadToServer会自动执行
console.log(`count has changed: ${count}`); // 当count变化时，console.log会自动执行
// 只有在init的时候执行一次
willMount(() => {
console.log(`Counter willMount with count ${count}`);
});
// 在elements被挂载到DOM之后执行
didMount(() => {
console.log(`Counter didMount with count ${count}`);
});
return (
<section>
count: {count}, double is: {doubleCount}
<button onClick={() => count++}>Add</button>
</section>
);
}
function MyComp() { function MyComp() {
let count = 0; let count = 0;
const db = count * 2;
{
console.log(count);
const i = count * 2;
console.log(i);
}
console.log(count);
const i = count * 2;
console.log(i);
const XX = () => {};
return ( return (
<> <>
@ -58,7 +117,7 @@ function MyComp() {
count: {count}, double is: {db} count: {count}, double is: {db}
<button onClick={() => (count += 1)}>Add</button> <button onClick={() => (count += 1)}>Add</button>
</section> </section>
<Button onClick={() => alert(count)}>{count}</Button> <Button onClick={() => alert(count)}>Alter count</Button>
<ConditionalRendering count={count} /> <ConditionalRendering count={count} />
<ArrayModification /> <ArrayModification />
</> </>

7
packages/transpiler/babel-preset-inula-next/CHANGELOG.md
View File

@ -1,5 +1,12 @@
# babel-preset-inula-next # babel-preset-inula-next
## 0.0.3
### Patch Changes
- Updated dependencies
- @openinula/class-transformer@0.0.2
## 0.0.2 ## 0.0.2
### Patch Changes ### Patch Changes

2
packages/transpiler/babel-preset-inula-next/package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "babel-preset-inula-next", "name": "babel-preset-inula-next",
"version": "0.0.2", "version": "0.0.3",
"author": { "author": {
"name": "IanDx", "name": "IanDx",
"email": "iandxssxx@gmail.com" "email": "iandxssxx@gmail.com"

7
packages/transpiler/class-transformer/CHANGELOG.md Normal file
View File

@ -0,0 +1,7 @@
# @openinula/class-transformer
## 0.0.2
### Patch Changes
- feat: add lifecycles and watch

2
packages/transpiler/class-transformer/package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "@openinula/class-transformer", "name": "@openinula/class-transformer",
"version": "0.0.1", "version": "0.0.2",
"description": "Inula view generator", "description": "Inula view generator",
"keywords": [ "keywords": [
"inula" "inula"

24
packages/transpiler/class-transformer/src/pluginProvider.ts
View File

@ -53,6 +53,14 @@ export class PluginProvider {
return; return;
} }
// ---- handle lifecycles
const lifecycles = ['willMount', 'didMount', 'willUnmount', 'didUnmount'];
if (this.t.isLabeledStatement(node) && lifecycles.includes(node.label.name)) {
// transform the lifecycle statement to lifecycle method
classTransformer.transformLifeCycle(node);
return;
}
// handle watch // handle watch
if (this.t.isLabeledStatement(node) && node.label.name === 'watch') { if (this.t.isLabeledStatement(node) && node.label.name === 'watch') {
// transform the watch statement to watch method // transform the watch statement to watch method
@ -172,7 +180,19 @@ class ClassComponentTransformer {
this.addProperty(body, 'Body'); this.addProperty(body, 'Body');
} }
transformLifeCycle() {} transformLifeCycle(node: t.LabeledStatement) {
// transform the lifecycle statement to lifecycle method
const methodName = node.label.name;
const method = this.t.classMethod(
'method',
this.t.identifier(methodName),
[],
this.t.blockStatement(node.body.body),
false,
false
);
this.addProperty(method, methodName);
}
transformComputed() {} transformComputed() {}
@ -218,7 +238,7 @@ class ClassComponentTransformer {
*/ */
transformWatch(node: t.LabeledStatement) { transformWatch(node: t.LabeledStatement) {
const id = this.functionScope.generateUidIdentifier(DECORATOR_WATCH.toLowerCase()); const id = this.functionScope.generateUidIdentifier(DECORATOR_WATCH.toLowerCase());
const method = this.t.classMethod('method', id, [], this.t.blockStatement([node]), false, false); const method = this.t.classMethod('method', id, [], this.t.blockStatement([node.body]), false, false);
method.decorators = [this.t.decorator(this.t.identifier(DECORATOR_WATCH))]; method.decorators = [this.t.decorator(this.t.identifier(DECORATOR_WATCH))];
this.addProperty(method); this.addProperty(method);
} }

6
packages/transpiler/vite-plugin-inula-next/CHANGELOG.md
View File

@ -1,5 +1,11 @@
# vite-plugin-inula-next # vite-plugin-inula-next
## 0.0.3
### Patch Changes
- babel-preset-inula-next@0.0.3
## 0.0.2 ## 0.0.2
### Patch Changes ### Patch Changes

5
packages/transpiler/vite-plugin-inula-next/package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "vite-plugin-inula-next", "name": "vite-plugin-inula-next",
"version": "0.0.2", "version": "0.0.3",
"author": { "author": {
"name": "IanDx", "name": "IanDx",
"email": "iandxssxx@gmail.com" "email": "iandxssxx@gmail.com"
@ -39,6 +39,7 @@
"esm" "esm"
], ],
"clean": true, "clean": true,
"dts": true "dts": true,
"minify": true
} }
} }