Skip to content

Commit 9b09136

Browse files
committed
feat: runtime-core init App Component
1 parent 5cf9437 commit 9b09136

File tree

9 files changed

+394
-19
lines changed

9 files changed

+394
-19
lines changed

example/helloWorld/App.js

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import { ref, h } from "../../packages/vue/dist/vue.esm-bundler.js";
2+
const count = ref(1);
3+
4+
const HelloWorld = {
5+
name: "HelloWorld",
6+
setup() {},
7+
render() {
8+
return h(
9+
"div",
10+
{
11+
tId: "helloWorld",
12+
},
13+
`hello world: count: ${count.value}`
14+
);
15+
},
16+
};
17+
18+
export default {
19+
name: "App",
20+
setup() {},
21+
render() {
22+
return h("div", { tId: 1 }, [h("p", {}, "homePage"), h(HelloWorld)]);
23+
},
24+
};

example/helloWorld/index.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Hello World</title>
8+
</head>
9+
<body>
10+
11+
<script src="./main.js" type="module"></script>
12+
</body>
13+
</html>

example/helloWorld/main.js

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import App from "./App.js";
2+
import { createApp } from '../../packages/vue/dist/vue.esm-bundler.js'
3+
4+
const rootContainer = document.querySelector("#root");
5+
createApp(App).mount(rootContainer);

jest.config.js

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
module.exports = {
2+
moduleNameMapper: {
3+
"@vue-kernel/(.*?)$": "<rootDir>/packages/$1/src",
4+
},
5+
rootDir: __dirname,
6+
};

package.json

+6-1
Original file line numberDiff line numberDiff line change
@@ -15,10 +15,15 @@
1515
"@babel/core": "^7.17.5",
1616
"@babel/preset-env": "^7.16.11",
1717
"@babel/preset-typescript": "^7.16.7",
18+
"@rollup/plugin-commonjs": "^21.0.3",
19+
"@rollup/plugin-json": "^4.1.0",
20+
"@rollup/plugin-node-resolve": "^13.1.3",
1821
"@types/jest": "^27.4.1",
1922
"babel-jest": "^27.5.1",
2023
"execa": "^5.0.0",
2124
"jest": "^27.5.1",
22-
"rollup": "^2.70.1"
25+
"rollup": "^2.70.1",
26+
"rollup-plugin-typescript2": "^0.31.2",
27+
"typescript": "^4.6.3"
2328
}
2429
}

rollup.config.js

+76-9
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,79 @@
1-
import path from 'path'
2-
import ts from 'rollup-plugin-typescript2'
3-
// import replace from '@rollup/plugin-replace'
4-
import json from '@rollup/plugin-json'
5-
import commonjs from '@rollup/plugin-commonjs'
6-
import resolvePlugin from '@rollup/plugin-node-resolve'
1+
import path from "path";
2+
import ts from "rollup-plugin-typescript2";
3+
import json from "@rollup/plugin-json";
4+
import commonjs from "@rollup/plugin-commonjs";
5+
import resolvePlugin from "@rollup/plugin-node-resolve";
76

8-
console.log(process.env.TARGET);
7+
if (!process.env.TARGET) {
8+
throw new Error("TARGET package must be specified via --environment flag");
9+
}
10+
11+
const packagesDir = path.resolve(__dirname, "packages");
12+
const packageDir = path.resolve(packagesDir, process.env.TARGET);
13+
const resolve = (p) => path.resolve(packageDir, p);
14+
const pkg = require(resolve("package.json"));
15+
const packageOptions = pkg.buildOptions || {};
16+
const name = packageOptions.filename || path.basename(packageDir);
17+
18+
const outputConfig = {
19+
"esm-bundler": {
20+
file: resolve(`dist/${name}.esm-bundler.js`),
21+
format: "es",
22+
},
23+
"esm-browser": {
24+
file: resolve(`dist/${name}.esm-browser.js`),
25+
format: "es",
26+
},
27+
cjs: {
28+
file: resolve(`dist/${name}.cjs.js`),
29+
format: "cjs",
30+
},
31+
global: {
32+
file: resolve(`dist/${name}.global.js`),
33+
format: "iife",
34+
},
35+
};
36+
37+
const defaultFormats = ["esm-bundler", "cjs"];
38+
const inlineFormats = process.env.FORMATS && process.env.FORMATS.split(",");
39+
const packageFormats =
40+
inlineFormats || packageOptions.formats || defaultFormats;
41+
42+
const packageConfigs = packageFormats.map((format) =>
43+
createConfig(format, outputConfig[format])
44+
);
45+
46+
export default packageConfigs;
47+
48+
function createConfig(format, output) {
49+
if (!output) {
50+
console.error(`invalid format: "${format}"`);
51+
return process.exit(1);
52+
}
53+
const isGlobalBuild = /global/.test(format);
54+
if (isGlobalBuild) {
55+
output.name = packageOptions.name;
56+
}
57+
58+
// output.sourcemap = !!process.env.SOURCE_MAP
59+
output.sourcemap = true;
960

10-
if(!process.env.TARGET){
11-
throw new Error('TARGET package must be specified via --environment flag')
61+
return {
62+
input: resolve(`src/index.ts`),
63+
output,
64+
plugins: [
65+
json(),
66+
ts({
67+
tsconfig: path.resolve(__dirname, "tsconfig.json"),
68+
}),
69+
resolvePlugin(),
70+
commonjs(),
71+
],
72+
onwarn: (msg, warn) => {
73+
// 忽略Circular的提醒
74+
if (!/Circular/.test(msg)) {
75+
warn(msg);
76+
}
77+
},
78+
};
1279
}

scripts/dev.js

+9
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,13 @@
33
* 本项目核心目标不在于打包,所以,dev & build都使用rollup
44
*/
55

6+
const execa = require("execa");
7+
const target = "vue";
68

9+
execa(
10+
"rollup",
11+
["-wc", "--environment", [`TARGET:${target}`].filter(Boolean).join(",")],
12+
{
13+
stdio: "inherit",
14+
}
15+
);

tsconfig.json

+12-3
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,22 @@
44
"moduleResolution": "node",
55
"esModuleInterop": true,
66
"target": "esnext",
7-
"module": "commonjs",
7+
"module": "esnext",
88
"noImplicitAny": false,
99
"removeComments": true,
1010
"preserveConstEnums": true,
1111
"sourceMap": true,
1212
"downlevelIteration": true,
13-
"lib": ["es6", "DOM"]
13+
"lib": [
14+
"es6",
15+
"DOM"
16+
],
17+
"baseUrl": ".",
18+
"paths": {
19+
"@vue-kernel/*": [
20+
"packages/*/src"
21+
]
22+
}
1423
},
1524
// "include": ["src/index.ts", "src/global.d.ts"]
16-
}
25+
}

0 commit comments

Comments
 (0)