更新记录

1.0.1（2026-06-05） 下载此版本

• 添加完整的使用文档（doc目录）
• 添加示例页面（pages目录）
• 添加静态资源（static目录）
• 更新 readme.md 添加 main.js、App.vue、pages.json 配置示例

1.0.0（2026-06-05） 下载此版本

• 初始版本发布
• 集成 dk-i18n 国际化模块
• 集成 dk-request 请求封装模块
• 集成 dk-store 状态管理模块
• 集成 dk-table 表格组件模块

平台兼容性

uni-app(3.7.9)

uni-app x(3.7.9)

DK TPL

基于 uni-app 的多端开发模板，包含请求封装、状态管理、国际化、表格组件与权限控制能力。

安装

在 HBuilderX 中导入本插件即可使用。

快速开始

1. main.js 配置

import App from './App'
import i18n from '@/uni_modules/dk-i18n/index.js'
import { setI18nInstance, pinia, Pinia } from '@/uni_modules/dk-store/index.js'
import { setupRequest } from '@/uni_modules/dk-request/index.js'

setI18nInstance(i18n)
i18n.registerLocaleMessages('en', {
  hello: 'Hello2222'
})
i18n.setLocale('en')

const { getApi, request } = setupRequest()

// #ifndef VUE3
import Vue from 'vue'
import VueI18n from 'vue-i18n'
import './uni.promisify.adaptor'
Vue.use(VueI18n)
Vue.prototype.$getApi = getApi
Vue.prototype.$request = request
const vue2I18n = new VueI18n(i18n.getI18nConfig())
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
  i18n: vue2I18n,
  ...App
})
app.$mount()
// #endif

// #ifdef VUE3
import { createSSRApp } from 'vue'
import { createI18n } from 'vue-i18n'

const vue3I18n = createI18n(i18n.getI18nConfig())

export function createApp() {
  const app = createSSRApp(App)
  app.use(pinia)

  app.config.globalProperties.$getApi = getApi
  app.config.globalProperties.$request = request
  app.use(vue3I18n)

  return {
    app,
    Pinia
  }
}
// #endif

2. App.vue 配置

<script>
export default {
  onLaunch: function() {
    console.log('App Launch')
  }, 
  onShow: function() {
    console.log('App Show')
  }, 
  onHide: function() {
    console.log('App Hide')
  }
}
</script>

<style>
@import "@/static/iconfont.css";

/*每个页面公共css */
</style>

3. pages.json 配置

{
  "pages": [
    {
      "path": "pages/demo/index/index",
      "style": {
        "navigationBarTitleText": "uni-app"
      }
    },
    {
      "path": "pages/demo/store/store",
      "style": {
        "navigationBarTitleText": "Store Demo"
      }
    },
    {
      "path": "pages/demo/table/table",
      "style": {
        "navigationBarTitleText": "Table Demo"
      }
    },
    {
      "path": "pages/login/login",
      "style": {
        "navigationBarTitleText": "Login"
      }
    }
  ],
  "globalStyle": {
    "navigationBarTextStyle": "black",
    "navigationBarTitleText": "uni-app",
    "navigationBarBackgroundColor": "#F8F8F8",
    "backgroundColor": "#F8F8F8"
  },
  "uniIdRouter": {}
}

模块说明

dk-i18n - 国际化模块

支持多语言配置和切换。

import i18n from '@/uni_modules/dk-i18n/index.js'

// 获取配置
const config = i18n.getI18nConfig()

// 设置语言
i18n.setLocale('en')

// 注册语言包
i18n.registerLocaleMessages('en', {
  hello: 'Hello'
})

dk-request - 请求封装模块

支持请求拦截、响应拦截和统一错误处理。

import { setupRequest } from '@/uni_modules/dk-request/index.js'

const { getApi, request } = setupRequest({
  baseURL: 'https://api.example.com',
  timeout: 30000
})

// 发送请求
request.post(getApi('loginSubmit'), { username: 'admin', password: '123456' })

dk-store - 状态管理模块

基于 Pinia，支持本地持久化。

import { User, App, pinia } from '@/uni_modules/dk-store/index.js'

// 用户状态
User.setToken('your-token')
User.setInfo({ name: 'Admin' })

// 应用状态
App.setLocale('zh-Hans')

dk-table - 表格组件模块

支持远程分页、本地筛选、树结构和权限控制。

import { createTableState, RemoteTable } from '@/uni_modules/dk-table/index.js'

const state = createTableState({ name: 'users', defaultPageSize: 20 })

const controller = new RemoteTable({
  name: 'users',
  fetch: api.searchUsers
})

const result = controller.load({ name: 'users', fetch: api.searchUsers }, state, setState, 1)

result.ctx.search()

目录结构

uni_modules/dk-tpl/
├── uniCloud/
├── components/
├── utssdk/
├── hybrid/
├── pages/
├── static/
├── wxcomponents/
├── license.md
├── package.json
├── readme.md
└── changelog.md

兼容性

• HBuilderX 3.1.0+
• uni-app 4.1.0+
• uni-app x 4.2.0+

更新日志

见 changelog.md

许可证

见 license.md