uniapp使用vue-cli新建项目并打包的步骤

更新时间：2023年11月10日 09:30:02 作者：小曲曲

这篇文章主要介绍了uniapp使用vue-cli新建项目并打包,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧

新建项目

npm install -g @vue/cli
vue create -p dcloudio/uni-preset-vue my-project

选择默认模板
npm run dev:h5 运行

安装sass和uview （npm安装失败）

bug：使用uni.scss中的变量或样式，<style lang="scss"> 必须加lang才会生效
bug：使用uview只需要安装 sass和 sass-loader即可，无需安装 node-scss
bug：npm装包失败，需要使用 yarn add 安装包即可

yarn add sass@1.49.8 sass-loader@8.0.2
yarn add uview-ui

main.js

import uView from "uview-ui";
Vue.use(uView);

uni.scss

@import 'uview-ui/theme.scss';

pages.json（和pages平行）

"easycom": {
		"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
	},

index.vue

<u-button type="primary">主要按钮</u-button>
<u-button type="success">成功按钮</u-button>
<u-button type="info">信息按钮</u-button>
<u-button type="warning">警告按钮</u-button>
<u-button type="error">危险按钮</u-button>
<style lang="scss">

打包

npm run build:h5

到此这篇关于uniapp使用vue-cli新建项目并打包的文章就介绍到这了,更多相关uniapp新建项目打包内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

JavaScript事件冒泡与事件捕获实例分析
这篇文章主要介绍了JavaScript事件冒泡与事件捕获,结合实例形式分析了事件冒泡、阻止冒泡以及事件捕获的相关原理、操作技巧与注意事项,需要的朋友可以参考下
2018-08-08
JS中超过Number类型的最大值数怎么处理详解(大数精度问题)
JavaScript的Number类型在我们平时写脚本的时候随处可见,下面这篇文章主要介绍了JS中超过Number类型的最大值数怎么处理的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
2025-09-09
解决layer 动态加载select 失效的问题
今天小编就为大家分享一篇解决layer 动态加载select 失效的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2019-09-09
MUI 实现侧滑菜单及其主体部分上下滑动的方法
下面小编就为大家分享一篇MUI 实现侧滑菜单及其主体部分上下滑动的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-01-01
利用JavaScript将Excel转换为JSON示例代码
这篇文章主要给大家介绍了关于利用JavaScript将Excel转换为JSON的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用JavaScript具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
2019-06-06
15个用于开发的TypeScript高级技巧分享
这篇文章主要来和大家分享一下15个用于开发的TypeScript高级技巧，文中的示例代码讲解详细，具有一定的学习价值，感兴趣的小伙伴可以了解一下
2023-07-07
JavaScript实现筛选数组
这篇文章主要为大家详细介绍了JavaScript实现筛选数组，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2021-03-03
postMessage及webSocket跨域方案详解
这篇文章主要为大家介绍了postMessage及webSocket跨域方案详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2022-10-10
js禁止页面刷新禁止用F5键刷新禁止右键的示例代码
刷新禁止用F5键刷新禁止右键这些在某些特殊情况下还是比较实用的，下面有个不错的示例，感兴趣的朋友可以参考下
2013-09-09
理解Javascript_05_原型继承原理
对于面向对象的基础语法在此我就不重复了，对面向对象不熟悉的朋友可以参看《使用面向对象的技术创建高级 Web 应用程序》一文。
2010-10-10