ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

Vue + Kbone 初探

2020-03-09 11:04:11  阅读:276  来源: 互联网

标签:npm Web Vue 程序 js webpack Kbone mp 初探


Kbone

什么是Kbone?

  • kbone 是一个致力于微信小程序和 Web 端同构的解决方案

简单点说Kbone实现了你可以用VueReact等开发微信小程序

详情请参考: Github && Docs

快速使用

前置环境

  • node
  • npm

开始

// 安装
npm install -g kbone-cli

// 创建项目
kbone init my-app

// 运行web端 localhost:8080
npm run web

// 运行小程序: 使用开发者工具打开 dist/mp 目录
npm run mp

// 构建Web端: dist/web目录
npm run build

// 构建小程序端: dist/mp 目录
npm run build:mp

更多可以查看项目下README文件

项目目录

├─ build
│  ├─ miniprogram.config.js  // mp-webpack-plugin 配置
│  ├─ webpack.base.config.js // Web 端构建基础配置
│  ├─ webpack.dev.config.js  // Web 端构建开发环境配置
│  ├─ webpack.mp.config.js   // 小程序端构建配置
│  └─ webpack.prod.config.js // Web 端构建生产环境配置
├─ dist
│  ├─ mp                     // 小程序端目标代码目录,使用微信开发者工具打开,用于生产环境
│  └─ web                    // web 端编译出的文件,用于生产环境
├─ src
│  ├─ common                 // 通用组件
│  ├─ mp                     // 小程序端入口目录
│  │  ├─ home                // 小程序端 home 页面
│  │  │  └─ main.mp.js       // 小程序端入口文件
│  │  └─ other               // 小程序端 other 页面
│  │     └─ main.mp.js       // 小程序端入口文件
│  ├─ detail                 // detail 页面
│  ├─ home                   // home 页面
│  ├─ list                   // list 页面
│  ├─ router                 // vue-router 路由定义
│  ├─ store                  // vuex 相关目录
│  ├─ App.vue                // Web 端入口主视图
│  └─ main.js                // Web 端入口文件
└─ index.html                // Web 端入口模板

标签:npm,Web,Vue,程序,js,webpack,Kbone,mp,初探
来源: https://blog.csdn.net/weixin_40663067/article/details/104747944

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有