初学者搭建Vue脚手架工程

1.在前端的知识海洋里,各种前端框架自动化测试满天飞,正如在当下想不被淘汰,那只有不断的去学习心得知识,所以就有了今天的一次学习vue搭建脚手架的记录。
2.第一步:搭建vue工程项目,传送门地址送给你:https://cli.vuejs.org/zh/ 此是官方的地址,各种文档甚是详细望大伙们观摩学习,早日脱凡入圣

3. 第二步:要搭建vue脚手架工程项目,首先的需要安装node.js二话不说送上传送门根据自己电脑系统和配置进行下载:https://nodejs.org/en/download/


下载好自己需要的位置进行傻瓜式的安装下一步下一步的安装就搞定了,为了验证node.js是否安装成功,按键盘上的window+R输入cmd打开DOS界面输入node -v如果有下面的显示嘿嘿恭喜你安装成功,同时输入npm -v (记得node 后加空格)如果没有显示报错那你的重新在安装一次实在不行呵呵就度娘你懂得。

4. 第三步:当然是今天的重头戏啦安装vue这一步不可少,npm intalll -g @vue/cli 或者yarn global add @vue/cli 下面的截图很明白就不废话了哈哈@vue/cli


这个界面很熟悉,需要验证vue 是否安装成功和版本信息嗯记得V是大写

5.第四步:既然看到这里嘿嘿那我就默认你已经把前面的所有的环境搭建步骤已经搭建好了,需要创建vue工程,其实我们有两种模式一种直接使用DOS命令行模式就是上面的黑乎乎的窗口,那么先不废话开搞,这个自己需要安装的文件夹打开DOS窗体输入vue create vue-hello敲回车.

我选择手动配置如下图操作回车跟上伙计:

不解释直接上图看操作回车嗯就是这样刚

剩下的时间交给它正在给你搭建,自己可以喝喝茶,逗逗妹子嗯就是这样开心。

等待它好以后看图操作:

根据提示敲入命令然后就会告诉你一串url,二话不说打开浏览器输入地址:

http://localhost:8080/ 出现下面图示就代表你已经创建成功了,这样vue脚手架搭建成功并运行在浏览器,下期在介绍vue ui 搭建的方法,再见。

初学者搭建Vue脚手架工程相关推荐

  1. 搭建Vue脚手架工程

    搭建Vue脚手架工程 Vue介绍 Vue是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或 ...

  2. vue脚手架工程搭建

    提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 vue脚手架工程搭建 一.vue 模块化开发 1.全局安装 webpack 2.全局安装 vue 脚手架 3.初始化 vue 项目 4 ...

  3. Vue 入门之搭建vue脚手架

    系列文章目录 第一章 Vue 入门之搭建vue脚手架 第二章 Vue入门之项目结构介绍 第三章 Vue入门之基本语法 第四章 Vue入门之企业站点开发实践 第五章 Vue入门之前端部署 文章目录 系列 ...

  4. webpack搭建vue脚手架

    之前搞过的webpack版本搭建vue脚手架项目,今天分享一下! 在读这篇文章之前你可能需要了解一些webpack的配置才行 否则可能看不懂部分配置 首先我们的项目的src目录结构如下 基本上与vue ...

  5. 搭建SpringBoot脚手架工程系列(1):Spring Initializr的超能力

    前言 SpringBoot作为Java后端最主流的技术栈,是每个Java程序员必备的技能.在微服务架构流行的时代,一个普通的企业级项目通常会有5-10个微服务,业务复杂的企业级项目甚至会有20个以上的 ...

  6. Vue2.0史上最全入坑教程(上)—— 搭建Vue脚手架(vue-cli)

    2019独角兽企业重金招聘Python工程师标准>>> ps: 想了解更多vue相关知识请点击VUE学习目录汇总 Vue作为前端三大框架之一截至到目前在github上以收获44,87 ...

  7. 二、Vue脚手架工程

    一.前言 使用vue,大部分是使用前后端分离技术,前端vue单独打包成项目运行.首先大概介绍一下vue脚手架,nodejs和webpack之间的关系. vue脚手架: vue官方提供的vue项目目录结 ...

  8. 使用mac搭建vue脚手架项目

    1.  需要安装Node.js C:\Users\wheat> node -v v8.9.3 C:\users\wheat> npm -v 2. 安装vue 脚手架 用cnpm(使用国内镜 ...

  9. 搭建vue脚手架 以及 npm ERR! missing script: serve解决方法

    目录 vue脚手架搭建 npm ERR! missing script: serve解决方法 vue脚手架搭建 前提是安装好vue,可以先输入下面这行代码检查是否安装vue vue --version ...

最新文章

  1. SpringCloud 介绍
  2. UITabBarController 和 UINavigationController 的详解
  3. 电脑键盘功能介绍_Excel应用041:全能电脑抽奖神器(功能介绍)(原创作品) ?...
  4. 学好Windows编程要看的书籍
  5. 非对称加密算法RSA
  6. leetcode_sql_1,176,177
  7. linkedin客户开发_10个LinkedIn WordPress插件赢得新客户
  8. Java数据库的介绍和使用
  9. 云计算时代的技术架构与开发模式
  10. 小程序开发用什么编程语言_微信小程序开发教程是什么?费用多少?
  11. 论文笔记22:QRNN3D: 3D Quasi-Recurrent Neural Network for Hyperspectral Image Denoising
  12. ansys apdl的使用方法
  13. C++STL算法 search你是我的半截的诗
  14. 对于业务中库存超卖测试
  15. Hadoop -- hadoop介绍
  16. Java后端社招面试个人总结
  17. corodva中使用高德地图web js api
  18. 华南理工大学化学考研
  19. 2019牛客网高级项目
  20. Android学习--LitePal使用

热门文章

  1. 如何获取到全国公司名称?
  2. 动态代理总结,你要知道的都在这里,无废话!
  3. sysctl 默认值_设置Linux内核参数 /etc/sysctl.conf
  4. 第一次写博客,为了激励自己学习的动力,写给自己看
  5. PhotoshopCS5第二篇 管理图像和使用绘图辅助工具
  6. 【Insights直播】3D建模服务,快速构建高质量3D模型
  7. 使用redis特性来创建每日流水号
  8. 计算机科学与技术专业歧视女生吗,考研选择这3大专业,女生就业不比男生差,反而女生更容易被看中...
  9. 西北工业大学#面向对象编程实验#实验三
  10. python 爬虫入门 到 初步精通罢