vue3.0架手架搭建以及注意事项

安装vue3.0的脚手架，主要步骤分为以为几布：
1⃣，npm install -g @vue/cli，(安装)
2⃣，vue create 你的文件名， //或者vue ui (这两个方式都是用来创建文件的但是后者是页面化的，需要自己手动配置需要的技术栈)
3⃣，cd 你的文件夹（进去文件夹）
4⃣，npm run serve （运行）以上就是搭建一个vue3.0脚手架的一个过程。
那么架子搭好了，我们就需要去使用，使用的过程中我们肯定需要一些技术栈呀，样式呀这些的配置，那接下来就说到了，
一：怎么去配置端口号？首先我们新建一个vue. config. js文件，其次在这个文件里
module. exports ｛
devServer:{
port: 你想要的端口号
}
｝
二：手机端开发的适配
第一种方案：使用flexible，我们在github上找到这个js文件，复制下来，复制到我们自己建的文件中，然后再main. js中引入。
第二种方案：【推荐】
我们可以在网上自行去搜索rem适配文档，然后复制到自己的文件中，同样也是在main. js中引入。
三：EsLint代码校验
如果我们是手动配置的vue3.0其中有一项就是勾选是否使用eslint，那eslint是什么呢？
其实就是代码规范，也就是说，我们的代码如果写的不规范，他就会弹出报错（这里的报错是跟我们写的逻辑不是一回事的）。那我们如果勾选了他，当他检测到我们的代码不规范，就不会去启动，会一直报错，那一个简单粗暴的方式就是关闭他
（在vue. config. js的module.exports中配置linkOnSavetrue）开玩笑啊，因为毕竟开了这个模式我们就是为了代码规范。那下面说下他的几种方案吧
1⃣：手动解决，就是我们看着控制台输出的报错，几行几列，报的什么问题，我去根据他的提示去代码里找到相应的位置，去做相应的修改（常见的就是//没有空格啦，多了个；号啦，作用域不对啦这类的问题）
2⃣：结合vs code来解决，我们在cs code中装一个Eslint，然后我们代码不规范的地方他会自动出来红色的波浪线，我们鼠标移到那里就会提醒你是否要修复，你可以选择只修复这一个问题也可以选择修复整个页面这样的的问题（通常带all的那个就是这个选项）
3⃣，通过eslint自带的–fix来修复，
我们在packjage. json里的scripts选项里{ ‘check’:eslint 具体的你要修复文件 --fix
}
【注：你的文件必须是具体的文件，而不能是一整个文件夹】

vue3.0架手架搭建以及注意事项相关推荐

学习Vue3.0，先从搭建环境开始
Bug源测试,上线来几个.愿君多修改,今夜眼难合. 这是小编关于Vue3.0系列文章的第二篇,本文将带您从零搭建一个基于Vue3.0与vite的Vue3.0开发环境,通过本文的学习,你将学习到以下内容 ...
Vue3.0 + Ts 项目框架搭建二：路由 Router
前言上篇文章我们使用 vue-cli 创建了模板项目,可以看到安装的依赖只有 vue,所以要正常的驱动项目,安装必要的依赖是跑不了. 其中Router是控制整个系统的页面路由,是最重要的依赖之一.因 ...
Vue3.0 + Ts 项目框架搭建四：配置 Svg-Icon、Icon图标
1. 在src文件下,创建components/SvgIcon/index.vue组件 <template><divv-if="isExternal":style ...
如何搭建一个完整的Vue3.0 + ts 的项目
如何搭建一个完整的Vue3.0 + ts 的项目相信9月18日尤大大的关于Vue3.0的发表演讲大家一定有所关注,现在Vue3.0 也已经进入RC阶段(最终产品的候选版本,如果没有问题则可发布成为正 ...
使用vue3.0和element实现后台管理模板
通过自己所学的这段时间,利用空余时间,使用vue3.0脚手架搭建的一个关于后台的管理模板,所实现功能也是模仿一个后台的界面,数据分为两种存放,一种是直接存储到mlab,这里的数据是存放这登录注册,只有 ...
vue 前端显示图片加token_前端Vue3.0：从0到1手把手撸码搭建管理后台系统
第1节 – 了解项目开发流程手把手撸码前端 – 第1学时了解产品从0到1的开发流程,产品经理.UI设计师.研发部.测试工程师第2节 – 构建vue项目.代码仓库管理手把手撸码前端 – 第2学时 ...
使用VUE3.0版本搭建H5模板
使用VUE3.0版本搭建H5模板仓库地址,有需要的可以参考参考 https://gitee.com/young_frivolous/vue3-app-template/tree/master 为了方 ...
vue3.0环境搭建
安装最新版nodejs Node.jshttps://nodejs.org/zh-cn/安装过程非常傻瓜,一直下一步到完成 -------------------------------------- ...
Vue2.0 + ElementUI 手写权限管理系统后台模板（三）——页面搭建
框架布局本章只介绍基础布局,和一些主要的js,页面上基本上都是些交互事件,项目代码上都有注释,不懂的地方debug跑一变就知道了,只是这些事件基本上没有独立存在的,相互之间都有关联框架风格新建页 ...
vue3.0+ts+element-plus多页签应用模板：项目搭建
目录系列文章一.安装vue-cli@4.5.x 二.创建项目三.项目配置四.IDE配置五.vue.config.js配置六.重置浏览器默认样式系列文章 vue3.0+ts+element ...

vue3.0架手架搭建以及注意事项

vue3.0架手架搭建以及注意事项相关推荐

最新文章

热门文章