接触VUE这个东西，时间说长不长，说短不短，作为一个刚入坑社会不久的程序员来说，我只能说是初有见识。提笔写下这篇博客，也只是希望可以帮助到一些刚入坑前端的萌新们，具体有一些说的不到位的地方，如果大家有发现的地方欢迎指正，让我们共同进步。

整篇文章我可能会用很皮的语风进行表达，如果是十分喜欢严谨的同学从这里开始就不要继续看下去了，可能会引起你极度的不适。~~另外在这里我想要说一句题外话，FGO这个五分游戏的9周年福利多会补呢？~~

为什么选择VUE

说的实在一点，就是“听说好用”。我觉得这种想法并不过分，当年淘宝为什么选择改用JAVA？也是因为“听说好用”。曾经在跟我的大神舍友讨论学习什么语言好的时候，我们就谈论到过这种话题，一个语言，用的人越少，他的泛用性就越低，生态环境来说就更加的稀疏，在你一无所有的时候选择一门语言或者一种开发技术，使用最热门的，最流行的，往往是对你帮助最大的，也许会是最好的。所以为什么选择VUE，因为听说他叼。

天才第一步（如何使用）

简单明了，以下均为笔者采用的工具，不代表最好。

IDE：VScode

笔者采用VUE+Webpack的开发方式，使用了Vue-cli进行开发，当然有各种各样的开发方式，大家选择自己喜欢的和适合自己来使用，在这里我只介绍此中开发方式（~~说句实话，因为别的我用的少，不会~~）。

1.下载Node.js，之后傻瓜安装。

2.使用NPM（node的包管理工具），之后我们下载一些插件都需要用到它。由于国内使用npm镜像可能会很慢，所以我们选择使用淘宝镜像npm install -g cnpm --registry=https://registry.npm.taobao.org

3.安装VUE——cnpm install vue

4.安装Vue-cli，这是官方提供的一个快速搭建单页面应用的脚手架，简单来说就是为了方便用户的开发。cnpm install -global vue-cli

5.开始创建我们自己的项目

在自己心仪的目录下，使用vue init webpack进行创建。

Project name（项目名称）

Project description（项目描述）

Author（作者）

Vue build（打包方式）

install vue-router？（是否安装vue-router，后面自己一起装就好了）

Use ESlint to lint your code（是否使用ESlint代码规范，有时候会报一些莫名其妙的错误，根据个人喜好，强迫症爱好者慎重）

Set up unit tests+Setup e2e tests with Nightwatch（是否启用单元测试）

之后创建你的项目，我们正在创建你的项目，这并不需要很长的时间（~~一小时过去了...一年过去了...~~）

在项目成功建立之后，输入cnpm install来安装依赖（一定要在你创建的项目的根目录下进行）

6.启动项目输入 npm run dev，已经有项目在8080端口跑了，所以这里笔者的端口号变为了8081

当在地址栏中输入地址之后，出现为这样，说明你的项目已经建立成功了

至此，项目的创建已经结束了，下一次将会对项目的目录进行讲解。

关于萌新初识VUE的那些事相关推荐

关于萌新初识VUE的那些事（在VUE中使用Echarts）
还是老样子,说之前的题外话.一直以肥宅自称的我今天终于也丧失了这个资格,在外面呆的时间久了,都不知道二次元已经成为了贬义词.就我自身而言,我觉得喜欢动漫,喜欢二次元的东西,都是很正常的事,但是要理智去 ...
声卡loopback有什么用_萌新做音乐那点事 | 外置专业声卡的选择方法与推荐
[本文长期更新,感兴趣可以点收藏] 前言:作为一名独立音乐人,接触了这么多年,自认为了解一点声卡的常识,为正在准备购买声卡[或是音频接口]的萌新音乐人做一篇介绍文. 市面常见的声卡品牌常见的品牌真的 ...
Ant Design Pro of Vue方案一权限路由配置（一步步完成，包括所有后端数据库代码，萌新向）
Ant Design Pro of Vue方案一权限路由配置(一步步完成,包括所有后端数据库代码,萌新向) 参考了许多csdn的文章,感谢大家为社区做的贡献,我也来汇总一波,谢谢
萌新养成 | AI科技大本营实习生招募计划
金三银四跳槽季这个时候需要做好准备的可不仅仅只有在职或者离职的萝卜尚未毕业的萌新也需要提早做准备了毕竟把自己修炼成一个优秀的萝卜也不是一件容易的事所以,放下你找对象.刷副本.世界游的想法加入 ...
从萌新玩家到游戏开发，IEG首位女专家的升级之路
我们为什么叫「递归」 "递归" (recursion) 是一种在程序设计语言中被广泛使用的算法.它有两大特点,一是调用自己,二是化繁为简.我们当中那些优秀的技术人又何尝不是如此?他 ...
【新手宝典】一篇博文带萌新建站并了解建站体系流程和对萌新友好的便捷方式，这篇博文很有可能是你的启蒙文
前言本片博文主要面向于还没接触过web开发的萌新,以及想知道整体流程并且完成建站的萌新:如果你是个大佬,就没必要看下去了. 本篇博文没有难啃的骨头,请各位萌新放心食用. 本篇博文采用通俗易懂的方式讲 ...
一篇文章指明做JavaWeb项目需要的前置知识+完整项目初解读(萌新必看，十分友好)
前言过了web这个阶段了,项目也完成了的我想给各位后来者总结一下我整个项目从开始到结束的经验,当然,也不是一帆风顺,报错有时候折磨的要死,废话不多说,现在就开始吧. 本文一共分为两个部分:纯理论科普 ...
html编程入门指南,给萌新HTML5 入门指南
本文由葡萄城技术团队原创并首发转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. HTML5的发展改变了互联网技术趋势,前端热度依旧不减,所以对于应用开发人员 ...
给萌新HTML5 入门指南
HTML5的发展改变了互联网技术趋势,前端热度依旧不减,所以对于应用开发人员前端技术也成了必备技能之一,本篇文章的目的是为了帮助萌新的入门指导,也同时希望能为老鸟起到一定查漏补缺的作用,那么让我们开始 ...

关于萌新初识VUE的那些事

为什么选择VUE

天才第一步（如何使用）

关于萌新初识VUE的那些事相关推荐

最新文章

热门文章