一步步讲解Vue如何启动项目
前言
废话就不多说了，直接进入正题
一、首先了解vue-cli脚手架
vue-cli 是一个基于 Vue.js 进行快速开发的完整系统
vue-cli是 基于 webpack 构建 vue 前端模块工程环境webpack 将 原理网页的 依赖变成 webpack的依赖， 只需要将网页的依赖在main.js 入口文件中引入即可在浏览器上运行
网址：介绍 | Vue CLI
二、安装脚手架
npm install -g @vue/cli
注意：查看node版本，要在v14以上
三、启动项目
命名为：
vue create 项目名
注意:创建的目录下的别的文件名不能包含vue，并且不能够使用驼峰命名法，两个单词之间使用“-”分割
运行命令成功，会出现一下界面：
让你进行选择是默认安装还是通过自己设置的安装。
这里选手动安装，第三个选项
接着会让选择相应的配置，勾选以下几个选项，利用空格勾选，所有选择完毕后按回车确认
这里选择2.x，根据需求选择
使用历史模式路由器?选择是
选择css预编译器，这里我选择的是sass
选择一个linter / formatter配置:这里选择的是标准配置
询问是否记住你所选择的配置，进行保存，这里选择保存
你喜欢把Babel, ESLint等的配置放在哪里?这里选择在专用配置文件中，新建了一个配置文件
询问是否记住你所选择的配置，在未来的项目创建中使用，进行保存，这里选择保存
起一个名字记录，下次方便找到
出现以下内容说明已经启动成功。
进入项目文件夹，在cmd命令行运行命令，注意：一定得去项目文件夹
npm run serve
出现这个内容表示项目启动完成。
附：解决vue 启动项目时间很长
突然想起来，之前开发vue项目的时候，第一次以及后续每次更改完东西后，页面都需要加载，启动时间很长，需要两三分钟！！
解决方案： 把config/index.js中的 useEslint 属性值改为 false 即可！！！
亲测过，真的好用哦！
总结
vue的项目启动过程中，还是存在一些小细节还是需要注意，小伙伴们还是得仔细的安装哦
到此这篇关于Vue如何启动项目的文章就介绍到这了,更多相关Vue启动项目内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要为大家详细介绍了vue3实现抽奖模板设置，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-03-03
这篇文章主要介绍了聊聊Vue.js的template编译的问题，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-10-10
这篇文章主要介绍了VUE项目实现主题切换的方法，本文通过多种方法给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-11-11
在Vue3项目中使用axios发送HTTP请求与后端MySQL数据库交互的步骤：1. 安装MySQL数据库并创建数据库表；2. 后端服务器使用Node.js的mysql模块实现MySQL数据库操作接口；3. Vue3项目中使用axios调用这些接口进行数据交互2024-11-11
vue+springboot+element+vue-resource实现文件上传教程
这篇文章主要介绍了vue+springboot+element+vue-resource实现文件上传教程，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-10-10
vue高德地图，带你玩转周边，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-06-06
Vue 实现 Tab切换实现的场景很多，比如，利用vue-router、利用第三方插件、利用组件等等.本文使用组件来实践tab选项卡2017-03-03
这篇文章主要介绍了Vue开发之封装上传文件组件与用法,结合实例形式分析了vue.js使用elementui的 el-upload插件进行上传文件组件的封装及使用相关操作技巧,需要的朋友可以参考下2019-04-04
这篇文章主要为大家详细介绍了vue中bus的相关使用以及涉及到的问题与解决,文中的示例代码简洁易懂,感兴趣的小伙伴可以跟随小编一起了解一下2023-08-08
在项目中,我们时常会遇到动态的去绑定操作切换不同的CSS样式,下面这篇文章主要给大家介绍了关于Vue3中动态修改样式与级联样式优先顺序的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2023-04-04
最新评论