@bundlekit/plugin-vue 0.0.1

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/index.ts ADDED
@@ -0,0 +1,17 @@
1
+ import type { IPluginAPIClass, IBuildConfig } from "@bundlekit/shared-utils";
2
+
3
+ export default {
4
+ defaultModes: {
5
+ "plugin:vue": "development" as const,
6
+ },
7
+ apply(api: IPluginAPIClass, options: IBuildConfig) {
8
+ const buildConfig = api.service.getBuildConfig();
9
+ if (!buildConfig) return;
10
+
11
+ for (const env of Object.keys(buildConfig.config || {})) {
12
+ buildConfig.config[env].framework = "vue3";
13
+ }
14
+
15
+ api.modifyBuildConfig(buildConfig);
16
+ },
17
+ };
package/package.json ADDED
@@ -0,0 +1,39 @@
1
+ {
2
+ "name": "@bundlekit/plugin-vue",
3
+ "version": "0.0.1",
4
+ "description": "Vue 3 plugin for bundlekit - provides Vue 3 build support and project templates",
5
+ "main": "./index.ts",
6
+ "type": "module",
7
+ "files": [
8
+ "index.ts",
9
+ "templates",
10
+ "package.json"
11
+ ],
12
+ "keywords": [
13
+ "vue",
14
+ "vue3",
15
+ "bundlekit-plugin",
16
+ "bundlekit"
17
+ ],
18
+ "author": "harhao@163.com",
19
+ "license": "ISC",
20
+ "dependencies": {
21
+ "@vitejs/plugin-vue": "^5.2.0",
22
+ "vue": "^3.5.0",
23
+ "vue-tsc": "^2.2.0",
24
+ "@bundlekit/shared-utils": "0.0.1"
25
+ },
26
+ "devDependencies": {
27
+ "typescript": "^5.8.2"
28
+ },
29
+ "publishConfig": {
30
+ "registry": "https://registry.npmjs.org/",
31
+ "access": "public"
32
+ },
33
+ "engines": {
34
+ "node": ">= 18.0.0"
35
+ },
36
+ "scripts": {
37
+ "plugin:vue:build": "echo 'plugin:vue built successfully'"
38
+ }
39
+ }
@@ -0,0 +1,27 @@
1
+ export default {
2
+ mode: "development",
3
+ bundler: "<%= bundler %>",
4
+ config: {
5
+ development: {
6
+ target: "web",
7
+ publicPath: "/",
8
+ entry: <% if (ssr) { %>"src/entry-client.js"<% } else { %>"src/main.js"<% } %>,
9
+ output: { dir: "dist", filename: "[name].js", formats: "esm" },
10
+ alias: { "@": "src" },
11
+ externals: [],
12
+ js: { sourcemap: true, minify: false, splitChunks: true },<% if (!ssr) { %>
13
+ pages: [
14
+ { entry: "src/main.js", filename: "index.html", template: "public/index.html", inject: "body" },
15
+ ],<% } %>
16
+ devServer: { open: true, proxy: {}, https: false, host: "0.0.0.0", port: 3000 },<% if (ssr) { %>
17
+ ssr: {
18
+ entry: "src/entry-server.js",
19
+ output: { dir: "dist/server", filename: "server.cjs", formats: "commonjs" },
20
+ externals: "auto",
21
+ template: "public/index.html",
22
+ placeholder: "<!--ssr-outlet-->",
23
+ dev: true,
24
+ },<% } %>
25
+ },
26
+ },
27
+ };
@@ -0,0 +1,18 @@
1
+ {
2
+ "name": "<%= projectName %>",
3
+ "version": "1.0.0",
4
+ "description": "<%= description %>",
5
+ "scripts": {
6
+ "clean": "rimraf dist",
7
+ "dev": "bundlekit-service serve --bundler <%= bundler %> --mode development",
8
+ "build": "bundlekit-service build --bundler <%= bundler %> --mode production"
9
+ },
10
+ "dependencies": {
11
+ "vue": "^3.5.0"
12
+ },
13
+ "devDependencies": {
14
+ "@bundlekit/service": "workspace:^",
15
+ "@bundlekit/plugin-vue": "workspace:^",
16
+ "@vitejs/plugin-vue": "^5.2.0"
17
+ }
18
+ }
@@ -0,0 +1,11 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title><%= projectName %></title>
7
+ </head>
8
+ <body>
9
+ <div id="app"><!--ssr-outlet--></div>
10
+ </body>
11
+ </html>
@@ -0,0 +1,19 @@
1
+ <script setup>
2
+ import { ref } from 'vue';
3
+
4
+ const count = ref(0);
5
+ </script>
6
+
7
+ <template>
8
+ <div>
9
+ <h1>
10
+ <span>Hello, <%= projectName %>!</span>
11
+ <button @click="count++">Clicked {{ count }} times</button>
12
+ </h1>
13
+ </div>
14
+ </template>
15
+
16
+ <style scoped>
17
+ h1 { font-family: sans-serif; color: #333; }
18
+ button { margin-left: 12px; padding: 4px 16px; }
19
+ </style>
@@ -0,0 +1,11 @@
1
+ import { createSSRApp, createApp } from "vue";
2
+ import App from "./App.vue";
3
+
4
+ const root = document.getElementById("app");
5
+ if (root) {
6
+ if (root.firstElementChild) {
7
+ createSSRApp(App).mount("#app", true);
8
+ } else {
9
+ createApp(App).mount("#app");
10
+ }
11
+ }
@@ -0,0 +1,8 @@
1
+ import { createSSRApp } from "vue";
2
+ import { renderToString } from "vue/server-renderer";
3
+ import App from "./App.vue";
4
+
5
+ export async function render(url) {
6
+ const app = createSSRApp(App);
7
+ return renderToString(app);
8
+ }
@@ -0,0 +1,4 @@
1
+ import { createApp } from 'vue';
2
+ import App from './App.vue';
3
+
4
+ createApp(App).mount('#app');
@@ -0,0 +1,47 @@
1
+ export default {
2
+ mode: "development" as const,
3
+ bundler: "<%= bundler %>",
4
+ plugins: ["@bundlekit/plugin-vue"],
5
+ config: {
6
+ development: {
7
+ target: "web" as const,
8
+ publicPath: "/",
9
+ entry: <% if (ssr) { %>"src/entry-client.ts"<% } else { %>"src/main.ts"<% } %>,<% if (!ssr) { %>
10
+ pages: [
11
+ { entry: "src/main.ts", filename: "index.html", template: "public/index.html", inject: "body" },
12
+ ],<% } %>
13
+ output: { dir: "dist", filename: "[name].js", formats: "esm" as const },
14
+ alias: { "@": "src" },
15
+ externals: [],
16
+ js: { sourcemap: true, minify: false, splitChunks: true },
17
+ devServer: { open: true, proxy: {}, https: false, host: "0.0.0.0", port: 3000 },<% if (ssr) { %>
18
+ ssr: {
19
+ entry: "src/entry-server.ts",
20
+ output: { dir: "dist/server", filename: "server.cjs", formats: "commonjs" as const },
21
+ externals: "auto" as const,
22
+ template: "public/index.html",
23
+ placeholder: "<!--ssr-outlet-->",
24
+ dev: true,
25
+ },<% } %>
26
+ },
27
+ production: {
28
+ target: "web" as const,
29
+ publicPath: "/",
30
+ entry: <% if (ssr) { %>"src/entry-client.ts"<% } else { %>"src/main.ts"<% } %>,<% if (!ssr) { %>
31
+ pages: [
32
+ { entry: "src/main.ts", filename: "index.html", template: "public/index.html", inject: "body" },
33
+ ],<% } %>
34
+ output: { dir: "dist", filename: "[name].[contenthash:8].js", formats: "esm" as const },
35
+ alias: { "@": "src" },
36
+ externals: [],
37
+ js: { sourcemap: false, minify: true, splitChunks: true },<% if (ssr) { %>
38
+ ssr: {
39
+ entry: "src/entry-server.ts",
40
+ output: { dir: "dist/server", filename: "server.cjs", formats: "commonjs" as const },
41
+ externals: "auto" as const,
42
+ template: "public/index.html",
43
+ placeholder: "<!--ssr-outlet-->",
44
+ },<% } %>
45
+ },
46
+ } as any,
47
+ };
@@ -0,0 +1,21 @@
1
+ {
2
+ "name": "<%= projectName %>",
3
+ "version": "1.0.0",
4
+ "description": "<%= description %>",
5
+ "scripts": {
6
+ "clean": "rimraf dist",
7
+ "dev": "bundlekit-service serve --bundler <%= bundler %> --mode development",
8
+ "build": "bundlekit-service build --bundler <%= bundler %> --mode production"
9
+ },
10
+ "dependencies": {
11
+ "vue": "^3.5.0"
12
+ },
13
+ "devDependencies": {
14
+ "@bundlekit/service": "workspace:^",
15
+ "@bundlekit/plugin-vue": "workspace:^",
16
+ "@vitejs/plugin-vue": "^5.2.0",
17
+ "rimraf": "^5.0.1",
18
+ "typescript": "^5.8.0",
19
+ "vue-tsc": "^2.2.0"
20
+ }
21
+ }
@@ -0,0 +1,11 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title><%= projectName %></title>
7
+ </head>
8
+ <body>
9
+ <div id="app"><!--ssr-outlet--></div>
10
+ </body>
11
+ </html>
@@ -0,0 +1,19 @@
1
+ <script setup lang="ts">
2
+ import { ref } from 'vue';
3
+
4
+ const count = ref(0);
5
+ </script>
6
+
7
+ <template>
8
+ <div>
9
+ <h1>
10
+ <span>Hello, <%= projectName %>!</span>
11
+ <button @click="count++">Clicked {{ count }} times</button>
12
+ </h1>
13
+ </div>
14
+ </template>
15
+
16
+ <style scoped>
17
+ h1 { font-family: sans-serif; color: #333; }
18
+ button { margin-left: 12px; padding: 4px 16px; }
19
+ </style>
@@ -0,0 +1,12 @@
1
+ import { createSSRApp, createApp } from "vue";
2
+ import App from "./App.vue";
3
+
4
+ const root = document.getElementById("app");
5
+ if (root) {
6
+ if (root.firstElementChild) {
7
+ // SSR:Vue 用 createSSRApp + mount('#app', true) 启用 hydration
8
+ createSSRApp(App).mount("#app", true);
9
+ } else {
10
+ createApp(App).mount("#app");
11
+ }
12
+ }
@@ -0,0 +1,8 @@
1
+ import { createSSRApp } from "vue";
2
+ import { renderToString } from "vue/server-renderer";
3
+ import App from "./App.vue";
4
+
5
+ export async function render(url: string): Promise<string> {
6
+ const app = createSSRApp(App);
7
+ return renderToString(app);
8
+ }
@@ -0,0 +1,4 @@
1
+ import { createApp } from 'vue';
2
+ import App from './App.vue';
3
+
4
+ createApp(App).mount('#app');
@@ -0,0 +1,20 @@
1
+ {
2
+ "compilerOptions": {
3
+ "target": "esnext",
4
+ "module": "esnext",
5
+ "moduleResolution": "node",
6
+ "strict": true,
7
+ "jsx": "preserve",
8
+ "esModuleInterop": true,
9
+ "skipLibCheck": true,
10
+ "forceConsistentCasingInFileNames": true,
11
+ "resolveJsonModule": true,
12
+ "isolatedModules": true,
13
+ "noEmit": true,
14
+ "baseUrl": ".",
15
+ "paths": {
16
+ "@/*": ["./src/*"]
17
+ }
18
+ },
19
+ "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.vue"]
20
+ }