alicorn-dev/data-fetch-plugin
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

start up

Browse Source
This commit is contained in:
薛家豪
2025-01-17 03:19:00 +08:00
parent 6d2bc0f2aa
commit b20a2d9849
25 changed files with 12546 additions and 229 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
vue-project/my-kintone-plugin/.eslintrc.js Normal file
View File

@@ -0,0 +1,13 @@
module.exports = {
extends: [
'@cybozu/eslint-config/globals/kintone.js',
'@cybozu/eslint-config/lib/base.js',
'@cybozu/eslint-config/lib/kintone.js',
'@cybozu/eslint-config/lib/prettier.js',
],
rules: {
'prettier/prettier': ['error', { singleQuote: true }],
'space-before-function-paren': 0,
'object-curly-spacing': 0,
},
};

7
vue-project/my-kintone-plugin/.prettierrc Normal file
View File

@@ -0,0 +1,7 @@
{
"singleQuote": true,
"semi": true,
"trailingComma": "all",
"printWidth": 120,
"bracketSpacing": true
}

16
vue-project/my-kintone-plugin/README.md
View File

@@ -1,5 +1,15 @@
# Vue 3 + Vite
# My-kintone-plugin
This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
1. 命令：
- `npm run build` 会将代码按照 kintone plugin 格式打包到 `dist`，并生成 `plugin.zip`
- `npm run upload` 会将 `plugin.zip` 上传到 kintone
Learn more about IDE Support for Vue in the [Vue Docs Scaling up Guide](https://vuejs.org/guide/scaling-up/tooling.html#ide-support).
2. 使用 Vue3.0 开发：
- 配置页面在 `components/Config.vue` 中开发
- Desktop 页面在 `js/desktop.ts` 中开发
3. 关于组件：
- 使用了 https://ui-component.kintone.dev/ 组件库，但是它没有支持 Vue，所以需要作为 Web Component 来使用
- 又由于 Web Component 的格式是类似 `<kuc-button-1-18-0>`，为了开发方便能写成 `<kuc-button>`，手动进行了全局替换（见 `vite.config.js`）
- 同时也定死了 kintone-ui-component 版本号，更新版本号需要修改 `vite.config.js` 的插件
- 目前尚未实现 `<template>` 中组件的 ts 提示

2
vue-project/my-kintone-plugin/env.d.ts vendored Normal file
View File

@@ -0,0 +1,2 @@
/// <reference types="vite/client" />
/// <reference types="kintone" />

17
vue-project/my-kintone-plugin/index.html
View File

@@ -1,19 +1,4 @@
<!-- <!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + Vue</title>
</head>
<body> -->
<section class="settings">
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</section>
<!-- </body>
</html> -->
<!-- <section class="settings">
<script type="module" src="/src/main.js"></script>
<div id="app"></div>
</section> -->
<script type="module" src="/src/main.ts"></script>

8107
vue-project/my-kintone-plugin/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

22
vue-project/my-kintone-plugin/package.json
View File

@@ -1,24 +1,34 @@
{
"name": "my-kintone-plugin",
"name": "data-fetch-plugin",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build ",
"preview": "vite preview",
"pkg":"kintone-plugin-packer --ppk private.ppk --out dist/plugin.zip dist/src"
"build": "vite build && npm run pkg",
"vite:build": "vite build",
"build-upload": "npm run build && npm run upload",
"pkg": "kintone-plugin-packer --ppk private.ppk --out dist/plugin.zip dist/src",
"upload": "kintone-plugin-uploader --base-url https://mfu07rkgnb7c.cybozu.com --username MXZ --password maxz1205 dist/plugin.zip "
},
"dependencies": {
"@kintone/rest-api-client": "^5.7.0",
"kintone-ui-component": "1.18.0",
"rollup-plugin-css-only": "^4.5.2",
"vue": "^3.5.13"
},
"devDependencies": {
"@vitejs/plugin-vue": "^5.2.1",
"rollup-plugin-copy": "^3.5.0",
"@cybozu/eslint-config": "^23.0.0",
"@kintone/dts-gen": "^8.1.1",
"@kintone/plugin-packer": "^8.1.3",
"@kintone/plugin-uploader": "^9.1.2",
"@vitejs/plugin-vue": "^5.2.1",
"@vue/tsconfig": "^0.7.0",
"eslint": "^8.57.0",
"vite": "^6.0.1"
"rollup-plugin-copy": "^3.5.0",
"typescript": "^5.7.3",
"vite": "^6.0.1",
"vue-tsc": "^2.1.10"
}
}

1
vue-project/my-kintone-plugin/public/vite.svg
View File

@@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.5 KiB

10
vue-project/my-kintone-plugin/src/App.vue
View File

@@ -1,10 +0,0 @@
<script setup>
import Config from './components/Config.vue'
</script>
<template>
<Config msg="Vite + Vue" />
</template>
<style scoped>
</style>

1
vue-project/my-kintone-plugin/src/assets/vue.svg
View File

@@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 496 B

42
vue-project/my-kintone-plugin/src/components/Config.vue
View File

@@ -1,38 +1,52 @@
<template>
<!-- <section class="settings"> -->
<h2 class="settings-heading">Settings for data fetch pluging</h2>
<p class="kintoneplugin-desc">This message is displayed on the app page after the app has been updated.</p>
<form class="js-submit-settings">
<p class="kintoneplugin-row">
<label for="message">
Message:
<input type="text" class="js-text-message kintoneplugin-input-text">
<input v-model="data.message" type="text" class="js-text-message kintoneplugin-input-text" />
</label>
</p>
<p class="kintoneplugin-row">
<button type="button" class="js-cancel-button kintoneplugin-button-dialog-cancel">Cancel</button>
<button class="kintoneplugin-button-dialog-ok">Save</button>
<kuc-button text="Cancel" type="normal" @click="cancel" />
<kuc-button text="Save" type="submit" @click="save" />
</p>
</form>
<!-- </section> -->
</template>
<script setup>
import { ref } from 'vue';
import '../css/51-modern-default.css';
import '../css/config.css';
<script setup lang="ts">
import { onMounted, reactive } from 'vue';
defineProps({
msg: String,
const props = defineProps<{ pluginId: string }>();
const data: {
message: string;
} = reactive({
message: '',
});
const count = ref(0)
</script>
onMounted(async () => {
const savedData = kintone.plugin.app.getConfig(props.pluginId);
data.message = JSON.parse(savedData.message);
});
function save() {
kintone.plugin.app.setConfig(
{ message: JSON.stringify(data.message) },
// () => {
// alert("The plug-in settings have been saved. Please update the app!");
// window.location.href = "../../flow?app=" + kintone.app.getId();
// }
);
}
function cancel() {
window.location.href = `../../${kintone.app.getId()}/plugin/`;
}
</script>
<style scoped>
.settings-heading {
padding: 1em 0;
}
.kintoneplugin-input-text {
width: 20em;
}

7
vue-project/my-kintone-plugin/src/css/config.css
View File

@@ -1,7 +0,0 @@
.settings-heading {
padding: 1em 0;
}
.kintoneplugin-input-text {
width: 20em;
}

25
vue-project/my-kintone-plugin/src/js/config.js
View File

@@ -1,25 +0,0 @@
(function (PLUGIN_ID) {
const formEl = document.querySelector('.js-submit-settings');
const cancelButtonEl = document.querySelector('.js-cancel-button');
const messageEl = document.querySelector('.js-text-message');
if (!(formEl && cancelButtonEl && messageEl)) {
throw new Error('Required elements do not exist.');
}
const config = kintone.plugin.app.getConfig(PLUGIN_ID);
if (config.message) {
messageEl.value = config.message;
}
formEl.addEventListener('submit', (e) => {
e.preventDefault();
kintone.plugin.app.setConfig({ message: messageEl.value }, () => {
alert('The plug-in settings have been saved. Please update the app!');
window.location.href = '../../flow?app=' + kintone.app.getId();
});
});
cancelButtonEl.addEventListener('click', () => {
window.location.href = '../../' + kintone.app.getId() + '/plugin/';
});
})(kintone.$PLUGIN_ID);

2
vue-project/my-kintone-plugin/src/js/desktop.js → vue-project/my-kintone-plugin/src/js/desktop.ts
View File

@@ -1,5 +1,3 @@
import '../css/desktop.css'
import '../css/51-modern-default.css';
(function (PLUGIN_ID) {
kintone.events.on('app.record.index.show', () => {
const spaceEl = kintone.app.getHeaderSpaceElement();

209
vue-project/my-kintone-plugin/src/js/kintone-config-helper.js Normal file
View File

@@ -0,0 +1,209 @@
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
typeof define === 'function' && define.amd ? define(['exports'], factory) :
(factory((global.KintoneConfigHelper = {})));
}(this, (function (exports) { 'use strict';
var ALL_FIELD_TYPES = [
"SINGLE_LINE_TEXT",
"MULTI_LINE_TEXT",
"RICH_TEXT",
"NUMBER",
"CALC",
"RADIO_BUTTON",
"CHECK_BOX",
"MULTI_SELECT",
"DROP_DOWN",
"DATE",
"TIME",
"DATETIME",
"FILE",
"LINK",
"USER_SELECT",
"ORGANIZATION_SELECT",
"GROUP_SELECT",
"REFERENCE_TABLE",
"SPACER",
"GROUP",
"SUBTABLE",
"RECORD_NUMBER",
"CREATOR",
"CREATED_TIME",
"MODIFIER",
"UPDATED_TIME"
];
function createKintoneClient(kintone) {
function fetchFormInfoByFields() {
var url = kintone.api.url("/k/v1/preview/app/form/fields", true);
var body = {
app: kintone.app.getId()
};
return kintone.api(url, "GET", body).then(function (resp) {
return resp.properties;
});
}
function fetchFormInfoByLayout() {
var url = kintone.api.url("/k/v1/preview/app/form/layout", true);
var body = {
app: kintone.app.getId()
};
return kintone.api(url, "GET", body).then(function (resp) {
return resp.layout;
});
}
return {
fetchFormInfoByFields: fetchFormInfoByFields,
fetchFormInfoByLayout: fetchFormInfoByLayout
};
}
/*! *****************************************************************************
Copyright (c) Microsoft Corporation. All rights reserved.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
this file except in compliance with the License. You may obtain a copy of the
License at http://www.apache.org/licenses/LICENSE-2.0
THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
MERCHANTABLITY OR NON-INFRINGEMENT.
See the Apache Version 2.0 License for specific language governing permissions
and limitations under the License.
***************************************************************************** */
var __assign = function() {
__assign = Object.assign || function __assign(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
function __rest(s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
t[p[i]] = s[p[i]];
return t;
}
var NOT_EXIST_MESSAGE = "Either the specified field type does not exist, or this method cannot respond the specified field type.";
var NOT_MATCH_MESSAGE = "Specify either characters or an array of characters for the getAllFields parameter.";
function createGetFields(kintoneClient, Promise_) {
var Promise = Promise_;
var fetchFormInfoByFields = kintoneClient.fetchFormInfoByFields, fetchFormInfoByLayout = kintoneClient.fetchFormInfoByLayout;
function removeUnnecessaryProperties(field) {
var _ = field.size, rest = __rest(field, ["size"]);
return rest;
}
function getFieldInfo(layoutFields) {
return layoutFields
.filter(function (layout) { return layout.type !== "LABEL" && layout.type !== "HR"; })
.map(function (field) { return removeUnnecessaryProperties(field); });
}
function modifiedLayoutResp(layoutList) {
return layoutList.reduce(function (acc, layout) {
switch (layout.type) {
case "ROW":
return acc.concat(getFieldInfo(layout.fields));
case "GROUP":
return acc.concat([
{ type: layout.type, code: layout.code }
], layout.layout
.map(function (childLayout) { return getFieldInfo(childLayout.fields); })
.reduce(function (acc, cur) { return acc.concat(cur); }, []));
case "SUBTABLE":
var layoutFieldsIncludeSubtableCode = layout.fields.map(function (layoutField) { return (__assign({}, layoutField, { subtableCode: layout.code })); });
return acc.concat([
{ type: layout.type, code: layout.code }
], getFieldInfo(layoutFieldsIncludeSubtableCode));
}
}, []);
}
function getLabeledFields(fieldsResp) {
return Object.keys(fieldsResp).reduce(function (acc, key) {
var _a;
var field = fieldsResp[key];
if (field.type === "SUBTABLE") {
return __assign({}, acc, getLabeledFields(field.fields));
}
return field.label ? __assign({}, acc, (_a = {}, _a[field.code] = field.label, _a)) : acc;
}, {});
}
function addLabel(layoutFieldList, fieldsResp) {
var labeledFields = getLabeledFields(fieldsResp);
return layoutFieldList.map(function (layoutField) {
return labeledFields[layoutField.code]
? __assign({}, layoutField, { label: labeledFields[layoutField.code] }) : layoutField;
});
}
function getLookupFieldKeys(fieldsResp) {
return Object.keys(fieldsResp).filter(function (key) { return typeof fieldsResp[key].lookup !== "undefined"; });
}
function filterLookupField(layoutFieldList, fieldsResp) {
var lookupFieldKeys = getLookupFieldKeys(fieldsResp);
if (lookupFieldKeys.length === 0)
;
return layoutFieldList.filter(function (layoutField) {
return !lookupFieldKeys.some(function (key) { return fieldsResp[key].code === layoutField.code; });
});
}
function flattenFieldsForSubtable(fieldsResp) {
return Object.keys(fieldsResp).reduce(function (fields, key) {
var _a, _b;
if (fieldsResp[key].type === "SUBTABLE") {
return __assign({}, fields, (_a = {}, _a[key] = fieldsResp[key], _a), fieldsResp[key].fields);
}
return __assign({}, fields, (_b = {}, _b[key] = fieldsResp[key], _b));
}, {});
}
function fetchAllFields(selectFieldTypes) {
return Promise.all([fetchFormInfoByFields(), fetchFormInfoByLayout()]).then(function (_a) {
var fieldsResp = _a[0], layoutResp = _a[1];
var fieldList = addLabel(filterLookupField(modifiedLayoutResp(layoutResp), flattenFieldsForSubtable(fieldsResp)), fieldsResp);
return selectFieldTypes
? fieldList.filter(function (field) { return selectFieldTypes.indexOf(field.type) !== -1; })
: fieldList;
});
}
function validateFieldType(fieldType) {
return ALL_FIELD_TYPES.some(function (type) { return type === fieldType; });
}
function validateGetAllFieldsArgument(fieldType) {
if (typeof fieldType === "string") {
return validateFieldType(fieldType) ? null : NOT_EXIST_MESSAGE;
}
if (Array.isArray(fieldType)) {
return fieldType.every(validateFieldType) ? null : NOT_EXIST_MESSAGE;
}
return NOT_MATCH_MESSAGE;
}
function getFields(selectFieldType) {
if (typeof selectFieldType === "undefined") {
return fetchAllFields();
}
var error = validateGetAllFieldsArgument(selectFieldType);
if (error) {
return Promise.reject(new Error(error));
}
return fetchAllFields(Array.isArray(selectFieldType) ? selectFieldType : [selectFieldType]);
}
return getFields;
}
var kintone = window.kintone;
var kintoneClient = createKintoneClient(kintone);
var getFields = createGetFields(kintoneClient, kintone.Promise);
exports.getFields = getFields;
Object.defineProperty(exports, '__esModule', { value: true });
})));

1
vue-project/my-kintone-plugin/src/js/mobile.js → vue-project/my-kintone-plugin/src/js/mobile.ts
View File

@@ -1,4 +1,3 @@
import '../css/mobile.css';
(function (PLUGIN_ID) {
kintone.events.on('mobile.app.record.index.show', () => {
const spaceEl = kintone.mobile.app.getHeaderSpaceElement();

5
vue-project/my-kintone-plugin/src/main.js
View File

@@ -1,5 +0,0 @@
import { createApp } from 'vue'
import './style.css'
import App from './App.vue'
createApp(App).mount('#app')

5
vue-project/my-kintone-plugin/src/main.ts Normal file
View File

@@ -0,0 +1,5 @@
import { createApp } from 'vue';
import Config from './components/Config.vue';
import allComponent from 'kintone-ui-component';
createApp(Config, { pluginId: kintone.$PLUGIN_ID }).mount('#app');

6
vue-project/my-kintone-plugin/src/manifest.json
View File

@@ -1,7 +1,7 @@
{
"$schema": "https://raw.githubusercontent.com/kintone/js-sdk/%40kintone/plugin-manifest-validator%4010.2.0/packages/plugin-manifest-validator/manifest-schema.json",
"manifest_version": 1,
"version": 2,
"version": 1,
"type": "APP",
"desktop": {
"js": [
@@ -27,11 +27,11 @@
]
},
"name": {
"en": "data fetch pluging",
"en": "data fetch plugin",
"ja": "データ取得プラグイン"
},
"description": {
"en": "create search data pluging",
"en": "create search data plugin",
"ja": "検索結果のデータを生成するプラグインです"
},
"mobile": {

79
vue-project/my-kintone-plugin/src/style.css
View File

@@ -1,79 +0,0 @@
:root {
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
line-height: 1.5;
font-weight: 400;
color-scheme: light dark;
color: rgba(255, 255, 255, 0.87);
background-color: #242424;
font-synthesis: none;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
a {
font-weight: 500;
color: #646cff;
text-decoration: inherit;
}
a:hover {
color: #535bf2;
}
body {
margin: 0;
display: flex;
place-items: center;
min-width: 320px;
min-height: 100vh;
}
h1 {
font-size: 3.2em;
line-height: 1.1;
}
button {
border-radius: 8px;
border: 1px solid transparent;
padding: 0.6em 1.2em;
font-size: 1em;
font-weight: 500;
font-family: inherit;
background-color: #1a1a1a;
cursor: pointer;
transition: border-color 0.25s;
}
button:hover {
border-color: #646cff;
}
button:focus,
button:focus-visible {
outline: 4px auto -webkit-focus-ring-color;
}
.card {
padding: 2em;
}
#app {
max-width: 1280px;
margin: 0 auto;
padding: 2rem;
text-align: center;
}
@media (prefers-color-scheme: light) {
:root {
color: #213547;
background-color: #ffffff;
}
a:hover {
color: #747bff;
}
button {
background-color: #f9f9f9;
}
}

7
vue-project/my-kintone-plugin/src/types/kintone-components.d.ts vendored Normal file
View File

@@ -0,0 +1,7 @@
declare global {
namespace JSX {
interface IntrinsicElements {
[key: string]: any;
}
}
}

29
vue-project/my-kintone-plugin/src/types/kintone.d.ts vendored Normal file
View File

@@ -0,0 +1,29 @@
// https://cybozu.dev/ja/kintone/docs/overview/field-types/
// https://cybozudev.kf5.com/hc/kb/article/201593/
declare namespace kintone.fieldTypes {
interface TABLE {
type: 'SUBTABLE';
value: any;
}
}
// lookup https://cybozudev.kf5.com/hc/kb/article/1611088/
// import { KintoneRestAPIClient } from '@kintone/rest-api-client';
// // 定义了一个Lookup类型，其中给lookup设置的是对象类型
// // 下面还有展开，到具体用的时候还会定义的更详细，这里够用了
// export type Lookup = {
// label: string;
// code: string;
// lookup: object;
// };
// // 创建sdk客户端
// const client = new KintoneRestAPIClient({
// baseUrl: 'https://yourdomain.cybozu.cn',
// });
// // 获取一个应用中所有类型是Lookup的字段
// export const getFormSetting = async () => {
// const prop = (await client.app.getFormFields({ app: kintone.app.getId() as number })).properties;
// const lookUpFields = Object.values(prop).filter((f) => 'lookup' in f) as Lookup[];
// return lookUpFields;
// };

14
vue-project/my-kintone-plugin/tsconfig.json Normal file
View File

@@ -0,0 +1,14 @@
{
"extends": "@vue/tsconfig/tsconfig.dom.json",
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
"exclude": ["src/**/__tests__/*"],
"files" : [
"./node_modules/@kintone/dts-gen/kintone.d.ts",
],
"compilerOptions": {
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
"paths": {
"@/*": ["./src/*"]
}
}
}

43
vue-project/my-kintone-plugin/vite.config.js
View File

@@ -2,31 +2,62 @@ import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import copy from "rollup-plugin-copy";
import path from 'path';
import fs from 'fs';
function replaceKucTagsPlugin() {
return {
name: 'vite-plugin-replace-tags',
async load(id) {
if (id.endsWith('.vue')) {
const content = await fs.promises.readFile(id, 'utf-8');
return content
.replace(/<\/kuc-([a-zA-Z0-9-]+)(?![0-9-])>/g, (match, p1) => `</kuc-${p1}-1-18-0>`)
.replace(/<kuc-([a-zA-Z0-9-]+)(?![0-9-])([^>]*)>/g, (match, p1, p2) => `<kuc-${p1}-1-18-0${p2}>`);
}
}
};
}
// https://vite.dev/config/
export default defineConfig({
plugins: [
vue(),
vue({
template: {
compilerOptions: {
isCustomElement: (tag) => tag.startsWith("kuc-"),
}
}
}),
copy({
targets: [
{ src: 'dist/index.html', dest: 'dist/src/html', rename: 'config.html' }
{ src: 'dist/index.html', dest: 'dist/src/html', rename: 'config.html' },
{ src: 'src/manifest.json', dest: 'dist/src' },
{ src: 'src/assets/*', dest: 'dist/src/image' },
{ src: 'src/css/*', dest: 'dist/src/css' },
],
hook: 'writeBundle' // 指定在何时复制文件
})
}),
replaceKucTagsPlugin()
],
build: {
rollupOptions: {
input: {
config: path.resolve(__dirname, 'index.html'),
desktop:path.resolve(__dirname,'src/js/desktop.js'),
mobile:path.resolve(__dirname,'src/js/mobile.js'),
desktop: path.resolve(__dirname, 'src/js/desktop.ts'),
mobile: path.resolve(__dirname, 'src/js/mobile.ts'),
},
output: {
entryFileNames: (chunkInfo) => {
// console.log(chunkInfo);
return 'src/js/[name].js'; // 默认处理为 JS 文件
},
assetFileNames:'src/[ext]/[name].[ext]'
assetFileNames: (assetInfo) => {
if (assetInfo.names[0].endsWith('.css') && assetInfo.originalFileNames[0] === 'index.html') {
return 'src/css/config.css';
}
// 其他资源文件的默认处理
return 'src/[ext]/[name].[ext]';
},
}
}
}

4091
vue-project/my-kintone-plugin/yarn.lock
View File

File diff suppressed because it is too large Load Diff