create-rsbuild 0.0.7 → 0.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +0 -0
- package/package.json +8 -13
- package/template-common/gitignore +13 -0
- package/template-react-js/package.json +18 -0
- package/template-react-js/rsbuild.config.mjs +9 -0
- package/template-react-js/src/App.jsx +22 -0
- package/template-react-js/src/index.css +41 -0
- package/template-react-js/src/index.html +10 -0
- package/template-react-js/src/index.jsx +11 -0
- package/template-react-ts/package.json +21 -0
- package/template-react-ts/rsbuild.config.ts +9 -0
- package/template-react-ts/src/App.tsx +22 -0
- package/template-react-ts/src/index.css +41 -0
- package/template-react-ts/src/index.html +10 -0
- package/template-react-ts/src/index.tsx +11 -0
- package/template-vue2-js/package.json +17 -0
- package/template-vue2-js/rsbuild.config.mjs +9 -0
- package/template-vue2-js/src/App.vue +27 -0
- package/template-vue2-js/src/index.css +41 -0
- package/template-vue2-js/src/index.html +10 -0
- package/template-vue2-js/src/index.js +8 -0
- package/template-vue2-ts/package.json +18 -0
- package/template-vue2-ts/rsbuild.config.ts +9 -0
- package/template-vue2-ts/src/App.vue +29 -0
- package/template-vue2-ts/src/env.d.ts +5 -0
- package/template-vue2-ts/src/index.css +41 -0
- package/template-vue2-ts/src/index.html +10 -0
- package/template-vue2-ts/src/index.ts +8 -0
- package/template-vue3-js/package.json +17 -0
- package/template-vue3-js/rsbuild.config.mjs +9 -0
- package/template-vue3-js/src/App.vue +29 -0
- package/template-vue3-js/src/index.css +41 -0
- package/template-vue3-js/src/index.html +10 -0
- package/template-vue3-js/src/index.js +5 -0
- package/template-vue3-ts/package.json +18 -0
- package/template-vue3-ts/rsbuild.config.ts +9 -0
- package/template-vue3-ts/src/App.vue +23 -0
- package/template-vue3-ts/src/env.d.ts +6 -0
- package/template-vue3-ts/src/index.css +41 -0
- package/template-vue3-ts/src/index.html +10 -0
- package/template-vue3-ts/src/index.ts +5 -0
package/dist/index.js
CHANGED
|
File without changes
|
package/package.json
CHANGED
|
@@ -8,8 +8,8 @@
|
|
|
8
8
|
"directory": "packages/create-rsbuild"
|
|
9
9
|
},
|
|
10
10
|
"license": "MIT",
|
|
11
|
-
"version": "0.0.
|
|
12
|
-
"types": "./
|
|
11
|
+
"version": "0.0.8",
|
|
12
|
+
"types": "./dist/index.d.ts",
|
|
13
13
|
"main": "./dist/index.js",
|
|
14
14
|
"bin": {
|
|
15
15
|
"create-rsbuild": "./dist/index.js"
|
|
@@ -20,14 +20,6 @@
|
|
|
20
20
|
"default": "./dist/index.js"
|
|
21
21
|
}
|
|
22
22
|
},
|
|
23
|
-
"files": [
|
|
24
|
-
"dist",
|
|
25
|
-
"template-*"
|
|
26
|
-
],
|
|
27
|
-
"scripts": {
|
|
28
|
-
"dev": "modern build --watch",
|
|
29
|
-
"build": "modern build"
|
|
30
|
-
},
|
|
31
23
|
"dependencies": {
|
|
32
24
|
"@clack/prompts": "^0.7.0",
|
|
33
25
|
"rslog": "^1.1.0"
|
|
@@ -39,7 +31,10 @@
|
|
|
39
31
|
"publishConfig": {
|
|
40
32
|
"registry": "https://registry.npmjs.org/",
|
|
41
33
|
"access": "public",
|
|
42
|
-
"provenance": true
|
|
43
|
-
|
|
34
|
+
"provenance": true
|
|
35
|
+
},
|
|
36
|
+
"scripts": {
|
|
37
|
+
"dev": "modern build --watch",
|
|
38
|
+
"build": "modern build"
|
|
44
39
|
}
|
|
45
|
-
}
|
|
40
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "rsbuild-react-js",
|
|
3
|
+
"private": true,
|
|
4
|
+
"version": "1.0.0",
|
|
5
|
+
"scripts": {
|
|
6
|
+
"dev": "rsbuild dev",
|
|
7
|
+
"build": "rsbuild build",
|
|
8
|
+
"preview": "rsbuild preview"
|
|
9
|
+
},
|
|
10
|
+
"dependencies": {
|
|
11
|
+
"react": "^18",
|
|
12
|
+
"react-dom": "^18"
|
|
13
|
+
},
|
|
14
|
+
"devDependencies": {
|
|
15
|
+
"@rsbuild/core": "nightly",
|
|
16
|
+
"@rsbuild/plugin-react": "nightly"
|
|
17
|
+
}
|
|
18
|
+
}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { useState } from 'react';
|
|
2
|
+
|
|
3
|
+
const HelloWorld = () => {
|
|
4
|
+
const [count, setCount] = useState(0);
|
|
5
|
+
|
|
6
|
+
return (
|
|
7
|
+
<div>
|
|
8
|
+
<h1>Rsbuild + React</h1>
|
|
9
|
+
|
|
10
|
+
<div>
|
|
11
|
+
<button type="button" onClick={() => setCount(count + 1)}>
|
|
12
|
+
count is {count}
|
|
13
|
+
</button>
|
|
14
|
+
<p>
|
|
15
|
+
Edit <code>App.tsx</code> to test HMR
|
|
16
|
+
</p>
|
|
17
|
+
</div>
|
|
18
|
+
</div>
|
|
19
|
+
);
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
export default HelloWorld;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
|
|
3
|
+
font-size: 16px;
|
|
4
|
+
line-height: 24px;
|
|
5
|
+
font-weight: 400;
|
|
6
|
+
color: #213547;
|
|
7
|
+
background-color: #ffffff;
|
|
8
|
+
max-width: 1280px;
|
|
9
|
+
margin: 0 auto;
|
|
10
|
+
padding: 5rem;
|
|
11
|
+
text-align: center;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
body {
|
|
15
|
+
margin: 0;
|
|
16
|
+
min-height: 100vh;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
h1 {
|
|
20
|
+
font-size: 3.2em;
|
|
21
|
+
line-height: 1.1;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
button {
|
|
25
|
+
border-radius: 8px;
|
|
26
|
+
border: 1px solid transparent;
|
|
27
|
+
padding: 0.6em 1.2em;
|
|
28
|
+
font-size: 1em;
|
|
29
|
+
font-weight: 500;
|
|
30
|
+
font-family: inherit;
|
|
31
|
+
background-color: #f9f9f9;
|
|
32
|
+
cursor: pointer;
|
|
33
|
+
transition: border-color 0.25s;
|
|
34
|
+
}
|
|
35
|
+
button:hover {
|
|
36
|
+
border-color: #646cff;
|
|
37
|
+
}
|
|
38
|
+
button:focus,
|
|
39
|
+
button:focus-visible {
|
|
40
|
+
outline: 4px auto -webkit-focus-ring-color;
|
|
41
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import ReactDOM from 'react-dom/client';
|
|
3
|
+
import './index.css';
|
|
4
|
+
import App from './App';
|
|
5
|
+
|
|
6
|
+
const root = ReactDOM.createRoot(document.getElementById('root'));
|
|
7
|
+
root.render(
|
|
8
|
+
<React.StrictMode>
|
|
9
|
+
<App />
|
|
10
|
+
</React.StrictMode>,
|
|
11
|
+
);
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "rsbuild-react-ts",
|
|
3
|
+
"private": true,
|
|
4
|
+
"version": "1.0.0",
|
|
5
|
+
"scripts": {
|
|
6
|
+
"dev": "rsbuild dev",
|
|
7
|
+
"build": "rsbuild build",
|
|
8
|
+
"preview": "rsbuild preview"
|
|
9
|
+
},
|
|
10
|
+
"dependencies": {
|
|
11
|
+
"react": "^18",
|
|
12
|
+
"react-dom": "^18"
|
|
13
|
+
},
|
|
14
|
+
"devDependencies": {
|
|
15
|
+
"@rsbuild/core": "nightly",
|
|
16
|
+
"@rsbuild/plugin-react": "nightly",
|
|
17
|
+
"@types/react": "^18",
|
|
18
|
+
"@types/react-dom": "^18",
|
|
19
|
+
"typescript": "^5.0.0"
|
|
20
|
+
}
|
|
21
|
+
}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { useState } from 'react';
|
|
2
|
+
|
|
3
|
+
const HelloWorld = () => {
|
|
4
|
+
const [count, setCount] = useState(0);
|
|
5
|
+
|
|
6
|
+
return (
|
|
7
|
+
<div>
|
|
8
|
+
<h1>Rsbuild + React</h1>
|
|
9
|
+
|
|
10
|
+
<div>
|
|
11
|
+
<button type="button" onClick={() => setCount(count + 1)}>
|
|
12
|
+
count is {count}
|
|
13
|
+
</button>
|
|
14
|
+
<p>
|
|
15
|
+
Edit <code>App.tsx</code> to test HMR
|
|
16
|
+
</p>
|
|
17
|
+
</div>
|
|
18
|
+
</div>
|
|
19
|
+
);
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
export default HelloWorld;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
|
|
3
|
+
font-size: 16px;
|
|
4
|
+
line-height: 24px;
|
|
5
|
+
font-weight: 400;
|
|
6
|
+
color: #213547;
|
|
7
|
+
background-color: #ffffff;
|
|
8
|
+
max-width: 1280px;
|
|
9
|
+
margin: 0 auto;
|
|
10
|
+
padding: 5rem;
|
|
11
|
+
text-align: center;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
body {
|
|
15
|
+
margin: 0;
|
|
16
|
+
min-height: 100vh;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
h1 {
|
|
20
|
+
font-size: 3.2em;
|
|
21
|
+
line-height: 1.1;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
button {
|
|
25
|
+
border-radius: 8px;
|
|
26
|
+
border: 1px solid transparent;
|
|
27
|
+
padding: 0.6em 1.2em;
|
|
28
|
+
font-size: 1em;
|
|
29
|
+
font-weight: 500;
|
|
30
|
+
font-family: inherit;
|
|
31
|
+
background-color: #f9f9f9;
|
|
32
|
+
cursor: pointer;
|
|
33
|
+
transition: border-color 0.25s;
|
|
34
|
+
}
|
|
35
|
+
button:hover {
|
|
36
|
+
border-color: #646cff;
|
|
37
|
+
}
|
|
38
|
+
button:focus,
|
|
39
|
+
button:focus-visible {
|
|
40
|
+
outline: 4px auto -webkit-focus-ring-color;
|
|
41
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import ReactDOM from 'react-dom/client';
|
|
3
|
+
import './index.css';
|
|
4
|
+
import App from './App';
|
|
5
|
+
|
|
6
|
+
const root = ReactDOM.createRoot(document.getElementById('root')!);
|
|
7
|
+
root.render(
|
|
8
|
+
<React.StrictMode>
|
|
9
|
+
<App />
|
|
10
|
+
</React.StrictMode>,
|
|
11
|
+
);
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "rsbuild-vue2-js",
|
|
3
|
+
"private": true,
|
|
4
|
+
"version": "1.0.0",
|
|
5
|
+
"scripts": {
|
|
6
|
+
"dev": "rsbuild dev",
|
|
7
|
+
"build": "rsbuild build",
|
|
8
|
+
"preview": "rsbuild preview"
|
|
9
|
+
},
|
|
10
|
+
"dependencies": {
|
|
11
|
+
"vue": "^2.7.14"
|
|
12
|
+
},
|
|
13
|
+
"devDependencies": {
|
|
14
|
+
"@rsbuild/core": "nightly",
|
|
15
|
+
"@rsbuild/plugin-vue2": "nightly"
|
|
16
|
+
}
|
|
17
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div>
|
|
3
|
+
<h1>Rsbuild + Vue</h1>
|
|
4
|
+
|
|
5
|
+
<div class="card">
|
|
6
|
+
<button type="button" @click="count++">count is {{ count }}</button>
|
|
7
|
+
<p>
|
|
8
|
+
Edit
|
|
9
|
+
<code>App.vue</code> to test HMR
|
|
10
|
+
</p>
|
|
11
|
+
</div>
|
|
12
|
+
</div>
|
|
13
|
+
</template>
|
|
14
|
+
|
|
15
|
+
<script>
|
|
16
|
+
export default {
|
|
17
|
+
data() {
|
|
18
|
+
return { count: 0 };
|
|
19
|
+
},
|
|
20
|
+
};
|
|
21
|
+
</script>
|
|
22
|
+
|
|
23
|
+
<style scoped>
|
|
24
|
+
.card {
|
|
25
|
+
padding: 2em;
|
|
26
|
+
}
|
|
27
|
+
</style>
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
|
|
3
|
+
font-size: 16px;
|
|
4
|
+
line-height: 24px;
|
|
5
|
+
font-weight: 400;
|
|
6
|
+
color: #213547;
|
|
7
|
+
background-color: #ffffff;
|
|
8
|
+
max-width: 1280px;
|
|
9
|
+
margin: 0 auto;
|
|
10
|
+
padding: 5rem;
|
|
11
|
+
text-align: center;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
body {
|
|
15
|
+
margin: 0;
|
|
16
|
+
min-height: 100vh;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
h1 {
|
|
20
|
+
font-size: 3.2em;
|
|
21
|
+
line-height: 1.1;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
button {
|
|
25
|
+
border-radius: 8px;
|
|
26
|
+
border: 1px solid transparent;
|
|
27
|
+
padding: 0.6em 1.2em;
|
|
28
|
+
font-size: 1em;
|
|
29
|
+
font-weight: 500;
|
|
30
|
+
font-family: inherit;
|
|
31
|
+
background-color: #f9f9f9;
|
|
32
|
+
cursor: pointer;
|
|
33
|
+
transition: border-color 0.25s;
|
|
34
|
+
}
|
|
35
|
+
button:hover {
|
|
36
|
+
border-color: #646cff;
|
|
37
|
+
}
|
|
38
|
+
button:focus,
|
|
39
|
+
button:focus-visible {
|
|
40
|
+
outline: 4px auto -webkit-focus-ring-color;
|
|
41
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "rsbuild-vue2-ts",
|
|
3
|
+
"private": true,
|
|
4
|
+
"version": "1.0.0",
|
|
5
|
+
"scripts": {
|
|
6
|
+
"dev": "rsbuild dev",
|
|
7
|
+
"build": "rsbuild build",
|
|
8
|
+
"preview": "rsbuild preview"
|
|
9
|
+
},
|
|
10
|
+
"dependencies": {
|
|
11
|
+
"vue": "^2.7.14"
|
|
12
|
+
},
|
|
13
|
+
"devDependencies": {
|
|
14
|
+
"@rsbuild/core": "nightly",
|
|
15
|
+
"@rsbuild/plugin-vue2": "nightly",
|
|
16
|
+
"typescript": "^5.0.0"
|
|
17
|
+
}
|
|
18
|
+
}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div>
|
|
3
|
+
<h1>Rsbuild + Vue</h1>
|
|
4
|
+
|
|
5
|
+
<div class="card">
|
|
6
|
+
<button type="button" @click="count++">count is {{ count }}</button>
|
|
7
|
+
<p>
|
|
8
|
+
Edit
|
|
9
|
+
<code>App.vue</code> to test HMR
|
|
10
|
+
</p>
|
|
11
|
+
</div>
|
|
12
|
+
</div>
|
|
13
|
+
</template>
|
|
14
|
+
|
|
15
|
+
<script lang="ts">
|
|
16
|
+
import { defineComponent } from 'vue';
|
|
17
|
+
|
|
18
|
+
export default defineComponent({
|
|
19
|
+
data() {
|
|
20
|
+
return { count: 0 };
|
|
21
|
+
},
|
|
22
|
+
});
|
|
23
|
+
</script>
|
|
24
|
+
|
|
25
|
+
<style scoped>
|
|
26
|
+
.card {
|
|
27
|
+
padding: 2em;
|
|
28
|
+
}
|
|
29
|
+
</style>
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
|
|
3
|
+
font-size: 16px;
|
|
4
|
+
line-height: 24px;
|
|
5
|
+
font-weight: 400;
|
|
6
|
+
color: #213547;
|
|
7
|
+
background-color: #ffffff;
|
|
8
|
+
max-width: 1280px;
|
|
9
|
+
margin: 0 auto;
|
|
10
|
+
padding: 5rem;
|
|
11
|
+
text-align: center;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
body {
|
|
15
|
+
margin: 0;
|
|
16
|
+
min-height: 100vh;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
h1 {
|
|
20
|
+
font-size: 3.2em;
|
|
21
|
+
line-height: 1.1;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
button {
|
|
25
|
+
border-radius: 8px;
|
|
26
|
+
border: 1px solid transparent;
|
|
27
|
+
padding: 0.6em 1.2em;
|
|
28
|
+
font-size: 1em;
|
|
29
|
+
font-weight: 500;
|
|
30
|
+
font-family: inherit;
|
|
31
|
+
background-color: #f9f9f9;
|
|
32
|
+
cursor: pointer;
|
|
33
|
+
transition: border-color 0.25s;
|
|
34
|
+
}
|
|
35
|
+
button:hover {
|
|
36
|
+
border-color: #646cff;
|
|
37
|
+
}
|
|
38
|
+
button:focus,
|
|
39
|
+
button:focus-visible {
|
|
40
|
+
outline: 4px auto -webkit-focus-ring-color;
|
|
41
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "rsbuild-vue3-js",
|
|
3
|
+
"private": true,
|
|
4
|
+
"version": "1.0.0",
|
|
5
|
+
"scripts": {
|
|
6
|
+
"dev": "rsbuild dev",
|
|
7
|
+
"build": "rsbuild build",
|
|
8
|
+
"preview": "rsbuild preview"
|
|
9
|
+
},
|
|
10
|
+
"dependencies": {
|
|
11
|
+
"vue": "^3.0.0"
|
|
12
|
+
},
|
|
13
|
+
"devDependencies": {
|
|
14
|
+
"@rsbuild/core": "nightly",
|
|
15
|
+
"@rsbuild/plugin-vue": "nightly"
|
|
16
|
+
}
|
|
17
|
+
}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { ref } from 'vue';
|
|
3
|
+
|
|
4
|
+
defineProps({
|
|
5
|
+
msg: {
|
|
6
|
+
type: String,
|
|
7
|
+
},
|
|
8
|
+
});
|
|
9
|
+
|
|
10
|
+
const count = ref(0);
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<template>
|
|
14
|
+
<h1>Rsbuild + Vue</h1>
|
|
15
|
+
|
|
16
|
+
<div class="card">
|
|
17
|
+
<button type="button" @click="count++">count is {{ count }}</button>
|
|
18
|
+
<p>
|
|
19
|
+
Edit
|
|
20
|
+
<code>App.vue</code> to test HMR
|
|
21
|
+
</p>
|
|
22
|
+
</div>
|
|
23
|
+
</template>
|
|
24
|
+
|
|
25
|
+
<style scoped>
|
|
26
|
+
.card {
|
|
27
|
+
padding: 2em;
|
|
28
|
+
}
|
|
29
|
+
</style>
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
|
|
3
|
+
font-size: 16px;
|
|
4
|
+
line-height: 24px;
|
|
5
|
+
font-weight: 400;
|
|
6
|
+
color: #213547;
|
|
7
|
+
background-color: #ffffff;
|
|
8
|
+
max-width: 1280px;
|
|
9
|
+
margin: 0 auto;
|
|
10
|
+
padding: 5rem;
|
|
11
|
+
text-align: center;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
body {
|
|
15
|
+
margin: 0;
|
|
16
|
+
min-height: 100vh;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
h1 {
|
|
20
|
+
font-size: 3.2em;
|
|
21
|
+
line-height: 1.1;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
button {
|
|
25
|
+
border-radius: 8px;
|
|
26
|
+
border: 1px solid transparent;
|
|
27
|
+
padding: 0.6em 1.2em;
|
|
28
|
+
font-size: 1em;
|
|
29
|
+
font-weight: 500;
|
|
30
|
+
font-family: inherit;
|
|
31
|
+
background-color: #f9f9f9;
|
|
32
|
+
cursor: pointer;
|
|
33
|
+
transition: border-color 0.25s;
|
|
34
|
+
}
|
|
35
|
+
button:hover {
|
|
36
|
+
border-color: #646cff;
|
|
37
|
+
}
|
|
38
|
+
button:focus,
|
|
39
|
+
button:focus-visible {
|
|
40
|
+
outline: 4px auto -webkit-focus-ring-color;
|
|
41
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "rsbuild-vue3-ts",
|
|
3
|
+
"private": true,
|
|
4
|
+
"version": "1.0.0",
|
|
5
|
+
"scripts": {
|
|
6
|
+
"dev": "rsbuild dev",
|
|
7
|
+
"build": "rsbuild build",
|
|
8
|
+
"preview": "rsbuild preview"
|
|
9
|
+
},
|
|
10
|
+
"dependencies": {
|
|
11
|
+
"vue": "^3.0.0"
|
|
12
|
+
},
|
|
13
|
+
"devDependencies": {
|
|
14
|
+
"@rsbuild/core": "nightly",
|
|
15
|
+
"@rsbuild/plugin-vue": "nightly",
|
|
16
|
+
"typescript": "^5.0.0"
|
|
17
|
+
}
|
|
18
|
+
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import { ref } from 'vue';
|
|
3
|
+
|
|
4
|
+
const count = ref(0);
|
|
5
|
+
</script>
|
|
6
|
+
|
|
7
|
+
<template>
|
|
8
|
+
<h1>Rsbuild + Vue</h1>
|
|
9
|
+
|
|
10
|
+
<div class="card">
|
|
11
|
+
<button type="button" @click="count++">count is {{ count }}</button>
|
|
12
|
+
<p>
|
|
13
|
+
Edit
|
|
14
|
+
<code>App.vue</code> to test HMR
|
|
15
|
+
</p>
|
|
16
|
+
</div>
|
|
17
|
+
</template>
|
|
18
|
+
|
|
19
|
+
<style scoped>
|
|
20
|
+
.card {
|
|
21
|
+
padding: 2em;
|
|
22
|
+
}
|
|
23
|
+
</style>
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
|
|
3
|
+
font-size: 16px;
|
|
4
|
+
line-height: 24px;
|
|
5
|
+
font-weight: 400;
|
|
6
|
+
color: #213547;
|
|
7
|
+
background-color: #ffffff;
|
|
8
|
+
max-width: 1280px;
|
|
9
|
+
margin: 0 auto;
|
|
10
|
+
padding: 5rem;
|
|
11
|
+
text-align: center;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
body {
|
|
15
|
+
margin: 0;
|
|
16
|
+
min-height: 100vh;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
h1 {
|
|
20
|
+
font-size: 3.2em;
|
|
21
|
+
line-height: 1.1;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
button {
|
|
25
|
+
border-radius: 8px;
|
|
26
|
+
border: 1px solid transparent;
|
|
27
|
+
padding: 0.6em 1.2em;
|
|
28
|
+
font-size: 1em;
|
|
29
|
+
font-weight: 500;
|
|
30
|
+
font-family: inherit;
|
|
31
|
+
background-color: #f9f9f9;
|
|
32
|
+
cursor: pointer;
|
|
33
|
+
transition: border-color 0.25s;
|
|
34
|
+
}
|
|
35
|
+
button:hover {
|
|
36
|
+
border-color: #646cff;
|
|
37
|
+
}
|
|
38
|
+
button:focus,
|
|
39
|
+
button:focus-visible {
|
|
40
|
+
outline: 4px auto -webkit-focus-ring-color;
|
|
41
|
+
}
|