小程序框架vue-mini

发表于2024-08-13|更新于2026-02-24

|浏览量:

即使对于君主，研究学问的道路也是没有捷径的。——阿基米德

分享一个基于 Vue 3 的小程序框架

https://vuemini.org/

https://github.com/vue-mini/vue-mini

Vue Mini 是一个基于 Vue 3 的小程序框架，它能让你用组合式 API 写小程序。与某些小程序开发方案不同的是 Vue Mini 核心仅仅是一个轻量的运行时库，它既不依赖任何编译步骤，也不涉及任何 Virtual DOM。并且 Vue Mini 从一开始就被设计为能跟小程序原生语法协同工作，你甚至能在同一个页面或组件内混用原生语法与 Vue Mini，这能让你很轻松的将其整合进既有项目中。当然，你也能完全使用 Vue Mini 开发一个小程序。

Vue Mini 仅聚焦于小程序逻辑部分，也就是 JS 部分，它并不影响小程序的模版、样式及配置。

快速创建

npm create vue-mini@latest
cd <your-project-name>
npm install
npm run dev

然后就可以用微信开发者工具打开

相关推荐

shenyu同时支持自定义rulehandler+pluginhandler

月缺不改光，剑折不改刚。——梅尧臣 https://github.com/apache/shenyu-dashboard/pull/511 主要是写了一个公共组件 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859/* * Licensed to the Apache Software Foundation (ASF) under one or more * contributor license agreements. See the NOTICE file distributed with * this work for additional information regarding copyright ownership. * The ASF licenses this file to You under the Apache License, Version 2.0 * (the "...

君子不责人所不及，不强人所不能，不苦人所不好。——王通官方文档侦听器 | Vue.js 写法有点不同 1234567891011121314151617181920212223242526272829303132<script setup>import { ref, watch } from 'vue'const question = ref('')const answer = ref('Questions usually contain a question mark. ;-)')const loading = ref(false)// 可以直接侦听一个 refwatch(question, async (newQuestion, oldQuestion) => { if (newQuestion.includes('?')) { loading.value = true answer.value = 'Thi...

vue2.0配置路由

古希腊哲学家芝诺的学生问他：“老师，难道你有不懂得的东西吗？”芝诺风趣地回答：“如果用小圆代表你们学到的知识，用大圆代表我学到的知识，那么大圆的面积是多一点；但两圆之外的空白，都是我们的无知面，圆越大，其圆周接触的无知面就越多。” 先说下端口配置吧项目根目录下新建一个文件叫vue.config.js 12345module.exports = { devServer: { port: 3000 }} 然后npm run serve运行项目，可以看到端口号变了然后再配置个路由吧 1cnpm i vue-router 在main.js中引入 123456789101112import Vue from 'vue'import App from './App.vue'import router from '@/router'Vue.config.productionTip = falsenew Vue({ router, rend...

TinyVue组件库

君子不隐其短，不知则问，不能则学。——董仲舒文档： TinyVue：一套跨端、跨框架的企业级 UI 组件库，支持 Vue 2 和 Vue 3，支持 PC 端和移动端代码： https://github.com/opentiny/tiny-vue 在项目的根目录中，打开控制台，执行以下命令，为 Vue 3.0 的项目安装 TinyVue 组件库： 123yarn add @opentiny/vue@3# 或者npm install @opentiny/vue@3 或者执行以下命令，为 Vue 2.0 的项目安装 TinyVue 组件库： 123yarn add @opentiny/vue@2# 或者npm install @opentiny/vue@2 如果是Vite 工程，安装完依赖后，修改项目的 vite.config.js ，添加以下代码突出显示的部分： 1234567891011// vite.config.jsimport { defineConfig } from 'vite'import vue from &#x...

用canvas消除锯齿的方式

不和不可以接物，不严不可以驭下。——林逋分享几种canvas消除锯齿的方式 1. 线条坐标增加0.5123456789<canvas id="canvas1" width="200" height="200"></canvas><script> var canvas = document.getElementById('canvas1'); var ctx = canvas.getContext('2d'); ctx.beginPath(); ctx.moveTo(0, 0.5); // 使用0.5增量对齐像素 ctx.lineTo(200, 0.5); // 绘制一条边缘清晰的直线 ctx.stroke();</script> 2. 使用高清画布1234567891011<canvas id="canvas2" style="width:200px; height:200px...

umijs环境变量问题

我们关心的，不是你是否失败了，而是你对失败能否无怨。——林肯今天遇到一个问题，umijs框架下的环境变量配置不好使首先是我package.json里的配置是这样的： 12345 "scripts": { "start": "cross-env NODE_ENV=dev umi dev", "build:test": "cross-env NODE_ENV=test umi build", "build:production": "cross-env NODE_ENV=prod umi build"} 然后在我其中一个js文件中进行引用： 12console.log({ NODE_ENV: process.env.NODE_ENV });console.log({ 'process.env': process.env }); 然后当我指...

阿超

我的名字叫阿超年龄25岁家在北京市职业是软件开发每天最晚也会在八点前回家不抽烟酒浅尝辄止晚上十二点上床保证睡足八个小时睡前写一篇博客再做二十分钟俯卧撑暖身然后再睡觉基本能熟睡到天亮像婴儿一样不留下任何疲劳和压力就这样迎来第二天的早晨健康检查结果也显示我很正常我想说明我是一个不论何时都追求内心平稳的人不拘泥于胜负不纠结于烦恼不树立使我夜不能寐的敌人这就是我在这社会的生活态度

数据加载中