Kbone官方框架

关注

推荐
  • 全部
  • 文章
  • 问答

  • kbone框架如何调用摄像头在小程序里拍照?

    项目是kbone + vue,我看kbone-ui不支持camera组件,想知道怎么在小程序内进行拍照?

  • 不是Vue也不是React框架,而只是一个传统的基于js的web前端项目该如何迁移?

    如果既没有使用Vue也不是React框架,而只是一个传统的基于js的web项目该如何用kbone迁移成小程序?

  • 拓展库引入kbone的版本能否更新一下?

    我看miniprogram-element更新说明已经支持了page-container组件,但是拓展库引入还无法使用[图片]

  • Kbone打包vue3项目发生的报错?

    [图片] 报错的地方,似乎提示是我引入script的路径出了问题,但是原项目并未存在script动态引入的情况。以下是 webpack.config.js const path = require('path') const webpack = require('webpack') const MiniCssExtractPlugin = require('mini-css-extract-plugin') const { VueLoaderPlugin } = require('vue-loader') const CssMinimizerPlugin = require('css-minimizer-webpack-plugin') const TerserPlugin = require('terser-webpack-plugin') const MpPlugin = require('mp-webpack-plugin') // 用于构建小程序代码的 webpack 插件 const mpPluginConfig = require('./miniprogram.config.js') const isOptimize = true // 是否压缩业务代码,开发者工具可能无法完美支持业务代码使用到的 es 特性,建议自己做代码压缩 module.exports = { mode: 'production', entry: { // js 入口 home: path.resolve(__dirname, '../src/main.mp.js'), }, output: { path: path.resolve(__dirname, './miniprogram/common'), // 放到小程序代码目录中的 common 目录下 library: 'createApp', // 必需字段,不能修改 libraryExport: 'default', // 必需字段,不能修改 libraryTarget: 'window', // 必需字段,不能修改 }, target: 'web', // 必需字段,不能修改 optimization: { runtimeChunk: false, // 必需字段,不能修改 splitChunks: { // 代码分割配置,不建议修改 chunks: 'all', minSize: 0, maxSize: 0, minChunks: 1, maxAsyncRequests: 100, maxInitialRequests: 100, automaticNameDelimiter: '~', name: false, cacheGroups: { defaultVendors: { test: /[\\/]node_modules[\\/]/, priority: -10 }, default: { minChunks: 2, priority: -20, reuseExistingChunk: true } } }, minimizer: isOptimize ? [ // 压缩CSS new CssMinimizerPlugin({ test: /\.(css|wxss)$/g, minimizerOptions: { preset: ["default", { discardComments: { removeAll: true }, }, ], }, }), // 压缩 js new TerserPlugin({ test: /\.js(\?.*)?$/i, parallel: true, }) ] : [], }, module: { rules: [ // css { test: /\.(css)$/, use: [ MiniCssExtractPlugin.loader, 'css-loader' ], }, // vue { test: /\.vue$/, loader: 'vue-loader', }, // js { test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/ }, { test: /\.(png|jpg|gif|svg)$/, loader: 'file-loader', options: { name: '[name].[ext]?[contenthash]' } } ] }, resolve: { extensions: ['.js', '.vue', '.json'], alias: { 'element-plus': 'element-plus/dist/index.full.min.js', '@': path.resolve(__dirname, '../src'), package: path.resolve(__dirname, '../package.json'), }, }, plugins: [ new webpack.DefinePlugin({ 'process.env.isMiniprogram': process.env.isMiniprogram, // 注入环境变量,用于业务代码判断 }), new MiniCssExtractPlugin({ filename: '[name].wxss', }), new VueLoaderPlugin(), new MpPlugin(mpPluginConfig), ], } 以下是miniprogram.config.js module.exports = { origin: 'https://test.miniprogram.com', entry: '/', router: { home: [ '/home', ], }, redirect: { notFound: 'home', accessDenied: 'home', }, generate: { globalVars: [['SVGElement', 'function SVGElement() {}']], // 兼容 vue3 3.0.8+ 版本 }, app: { backgroundTextStyle: 'dark', navigationBarTextStyle: 'white', navigationBarTitleText: 'miniprogram-project', }, appExtraConfig: { sitemapLocation: 'sitemap.json', }, global: { share: true, windowScroll: false, backgroundColor: '#F7F7F7', }, pages: {}, optimization: { domSubTreeLevel: 10, elementMultiplexing: true, textMultiplexing: true, commentMultiplexing: true, domExtendMultiplexing: true, styleValueReduce: 5000, attrValueReduce: 5000, }, projectConfig: { appid: 'wx3c952c5a483fe03f', projectname: 'genshin-calculator', }, }

  • permission 在kbone里面应该写在那个位置?

    项目里需要用到定位 但是不知道premission这个属性写什么位置 有大佬知道吗?

  • kbone打包后的页面,刷新后卡死,接口响应空白,如何处理?

    kbone打包后的小程序项目体积大小大概是1600kb左右,第一次进入页面没问题,用wx.redirectTo或者是wx.reLaunch重新进入页面就会出现接口响应空白(状态码是200)、页面卡死点击无反应等问题,如下图,请问各位大佬有知道什么原因导致的吗?如何解决? 目前暂时处理的方法: 1、在进入页面时先用wx.navigateTo新开一个页面跑 2、当前页面销毁时清除页面dom(document.body.innerHTML = ''),这样重新进入页面就不会出现页面卡死等问题了 但是感觉这不是一个好的方法 [图片]

  • kbone种 怎样引入腾讯的OCR人脸识别,因为不能像原生一样 在app.json种 ?

    1.文档地址:https://cloud.tencent.com/document/product/1007/31071 需要添加的路径,但是kbone 怎样添加这个page呢 [图片] 2.报错信息,已经引入进来 但是进行跳转人面识别的时候 找不到sdk种的页面 [图片]

  • umi + dva + kbone 运行报错,请问有人成功过吗?

    umi3创建的项目,拿其中一个页面来测试,编译后运行报错: TypeError: Cannot read property 'store' of null at Connect(AppGuide) var store = didStoreComeFromProps ? props.store : contextValue.store; var contextValue = Object(react["useContext"])(ContextToUse); var ContextToUse = Object(react["useMemo"])(function () { // Users may optionally pass in a custom context instance to use instead of our ReactReduxContext. // Memoize the check that determines which context instance we should use. return propsContext && propsContext.Consumer && Object(react_is["isContextConsumer"])( /*#__PURE__*/react_default.a.createElement(propsContext.Consumer, null)) ? propsContext : Context; }, [propsContext, Context]); connect是dva,主要问题应该还是在dva上,请问这个组合有人有成功过吗?有案例/经验分享吗?网上找不到什么类似的case

  • kbone引用painter插件生成海报,控制台报错?

    页面引用: [图片] 自定义组件: [图片] 报错: [图片]

  • kbone中使用华为手机使用canvas绘制图片后,调用toDataUrl拿不到base64?

    麻烦大佬关注下这个问题:https://github.com/Tencent/kbone/issues/427

  • kbone使用map组件无法动态渲染的问题?

    kbone使用map组件动态渲染报错[图片] <wx-map id="myMap" :longitude="map.lng" :latitude="map.lat" scale="14" :markers="markers" style="width: 100%; height: 100%" :show-location="true" @markertap="bindmarkertap" > <cover-view> <cover-view style=" padding: 10px; height: 200px; " > <cover-view class="item" style=" background-color: #fff; padding: 8px; display: flex; margin-bottom: 8px; " v-for="(item, index) in arr" :key="index" > <cover-view class="left"> </cover-view> <cover-view class="right"> <cover-view style="margin: 0">{{ item.departName }}</cover-view> <cover-view style="margin: 0">{{ item.juli }} {{ item.address }}</cover-view> <cover-view style="margin: 0">营业时间:{{ item.openingHours }}</cover-view> </cover-view> </cover-view> </cover-view> </cover-view> </wx-map> async getNearbyDepartBy() { const res = await getAction( "/sys/sysDepart/getNearbyDepartBy?longitude=" + this.map.lng + "&latitude=" + this.map.lat + "&departId=" + this.organizationId ); if (res.success) { this.arr = res.result.records; } }, 有大佬知道这是怎么回事吗?

  • kbone-react 模板怎么使用less 语法呢?

    kbone-react 模板怎么使用less 语法呢? 我这边安装使用了 less 文件就是失败 [图片] { "name": "react-kbone", "version": "0.0.1", "description": "", "author": "wechat-miniprogram", "keywords": [ "react", "kbone", "mp" ], "scripts": { "start": "npm run mp", "web": "cross-env NODE_ENV=development webpack-dev-server --progress --config build/webpack.dev.config.js", "mp": "rimraf dist/mp/common && cross-env NODE_ENV=development webpack --config build/webpack.mp.config.js --watch --progress", "build": "rimraf dist/web && cross-env NODE_ENV=production webpack --config build/webpack.prod.config.js --progress", "build:mp": "rimraf dist/mp/common && cross-env NODE_ENV=production webpack --config build/webpack.mp.config.js --progress" }, "dependencies": { "react": "^16.9.0", "react-dom": "^16.9.0", "react-vant": "^2.0.0-alpha.27" }, "browserslist": [ "> 1%", "last 2 versions", "not ie <= 8" ], "devDependencies": { "@webpack-cli/serve": "^1.6.1", "babel-core": "^6.26.0", "babel-loader": "^7.1.2", "babel-plugin-transform-runtime": "^6.23.0", "babel-preset-env": "^1.7.0", "babel-preset-react": "^6.24.1", "babel-preset-stage-3": "^6.24.1", "cross-env": "^5.0.5", "css-loader": "^0.28.11", "file-loader": "^1.1.4", "html-webpack-plugin": "^4.5.2", "less": "^3.9.0", "less-loader": "^4.1.0", "mini-css-extract-plugin": "^0.5.0", "mp-webpack-plugin": "latest", "optimize-css-assets-webpack-plugin": "^5.0.8", "portfinder": "^1.0.28", "rimraf": "^2.7.1", "style-loader": "^2.0.0", "stylehacks": "^4.0.3", "terser-webpack-plugin": "^4.2.3", "webpack": "^4.29.6", "webpack-cli": "^4.9.2", "webpack-dev-server": "^4.7.4", "webpack-merge": "^5.8.0" }, "license": "MIT" }

  • kbone自定义app.js有人能成功的吗?

    我自己按照官方文档搭建的,或者把demo5拿下来生成都不行,都会没办法自定义app.js

  • 没有使用摄像头 和 麦克风,为啥提交的代码审核微信要求提交隐私使用说明?

    请问怎么解决?

  • kbone打包生成的小程序页面路径能改变吗?必须是pages/xxx/index?

    页面路径为 pages/xxx/xxx 但是kbone生成的小程序app.json里的都是xxx/index,能改变吗。

  • 图片上传有什么解决方案?

    一年前用kboneapi+ui写了一个兼容H5的小程序。但是小程序端图片上传一直没有得到解决 <div class="txtopt">需求图片:</div> <div class="weui-cell"> <ul class="weui-uploader__files" id="uploaderFiles"> <li class="weui-uploader__file" v-bind:style="imgstyle"></li> </ul> <div class="weui-uploader__input-box" v-show="upshow"> <input class="weui-uploader__input" type="file" id="upload" accept="image" @change="upimg"> </div> </div> 问题就是H5与开发者工具测试都OK ,小程序发布后情况类似intput当成一个输入框,弹出输入法。图片上传的+按钮无法触发 一直未解决。官方也一直没有图片上传的解决方案

  • 使用kbone快速开发找不到模板?

    [图片]

  • 能支持webpack5吗?

    这边均是webpack5作为构建工具,kbone的vue demo下载是webpack4的,这个能兼容不

  • kbone能否将小程序自定义组件放在分包中?

    引入的腾讯云点播和对象存储sdk太大了,想放在分包里面,kbone能否实现吗?

  • kobone中使用自定义组件,React要怎么绑定事件才能生效呢?

    [图片][图片] 这是官方提供的vue的格式,我用React,然后正常绑定[图片] 在原生自定义组件中触发不了这个方法,是我绑方法的格式有问题吗