一、搭建工作环境环境

  1、从node.js官网下载相应版本进行安装即可 https://nodejs.org/zh-cn/download/,安装完成后在命令行输入  node -v 如果可以查询到版本号,说明安装成功。

  2、node自带npm包管理工具,在命令行输入  npm -v 如果查询到版本号,说明正常

  3、npm下载太慢,需要下载国内淘宝镜像: npm install -g cnpm --registry = https://registry.npm.taobao.org,安装完成后输入 cnpm -v 显示版本号,说明正常

  4、安装webpack(包管理工具),命令行输入  cnpm i webpack -g   ,-g说明是全局安装

  5、安装vue.cli 3.X脚手架,命令行输入 cnpm i @vue-cli -g      不选择版本号,将下载最新的稳定版本,输入vue -V 可查看版本

二、创建项目

  1、命令行 进入项目目录

  2、创建项目:vue create 项目名称(不要有中文),选择manually select进行选择

  3、进入选择界面

根据项目需求,点击空格进行选择,一般情况下babel、router、vuex、 css都是需要的,然后回车进行创建项目

  4、创建时会询问之前选择项目的配置,根据自身项目 要求进行配置,下图是我的配置

最后选择是否作为默认配置,根据个人需要进行选择即可,然后回车,项目开始下载模板

  5、创建完成后,进入项目目录,输入cnpm run serve 即可启动项目,登陆后界面如下图

  

 

vue3.0学习笔记(一)的更多相关文章

  1. vue3.0学习笔记(二)

    一.选择合适的ide 推荐使用vs code编辑器,界面清晰.使用方便,控制台功能很好用.webstorm也可以,看个人喜好. 二.ui框架选择 目前,pc端一般是选择element ui(饿了么), ...

  2. DirectX 总结和DirectX 9.0 学习笔记

    转自:http://www.cnblogs.com/graphics/archive/2009/11/25/1583682.html DirectX 总结 DDS DirectXDraw Surfac ...

  3. 一起学ASP.NET Core 2.0学习笔记(二): ef core2.0 及mysql provider 、Fluent API相关配置及迁移

    不得不说微软的技术迭代还是很快的,上了微软的船就得跟着她走下去,前文一起学ASP.NET Core 2.0学习笔记(一): CentOS下 .net core2 sdk nginx.superviso ...

  4. vue2.0学习笔记之路由(二)路由嵌套+动画

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. vue2.0学习笔记之路由(二)路由嵌套

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. hdcms v5.7.0学习笔记

    hdcms v5.7.0学习笔记 https://note.youdao.com/ynoteshare1/index.html?id=c404d63ac910eb15a440452f73d6a6db& ...

  7. dhtmlxgrid v3.0学习笔记

    dhtmlxgrid v3.0学习笔记 分类: dhtmlx JavaScript2012-01-31 15:41 1744人阅读 评论(0) 收藏 举报 stylesheetdatecalendar ...

  8. OAuth 2.0学习笔记

    文章目录 OAuth的作用就是让"客户端"安全可控地获取"用户"的授权,与"服务商提供商"进行互动. OAuth在"客户端&quo ...

  9. 一起学ASP.NET Core 2.0学习笔记(一): CentOS下 .net core2 sdk nginx、supervisor、mysql环境搭建

    作为.neter,看到.net core 2.0的正式发布,心里是有点小激动的,迫不及待的体验了一把,发现速度确实是快了很多,其中也遇到一些小问题,所以整理了一些学习笔记: 阅读目录 环境说明 安装C ...

随机推荐

  1. VUE之使用百度地图API

    利用vue创建点餐系统,在点餐系统中需要知道商家地址信息,这时就需要借用百度地图API. 步骤一:申请百度地图密钥: 步骤二:在index.html中添加百度地图JavaScript API接口: & ...

  2. linux下将编译错误输出到一个文本文件

    linux下将编译错误输出到一个文本文件 command > filename 把把标准输出重定向到一个新文件中 command > > filename 把把标准输出重定向到一个文 ...

  3. Struts2工作原理和执行流程图

    在struts2的应用中,从用户请求到服务器返回相应响应给用户端的过程中,包含了许多组件如:Controller.ActionProxy.ActionMapping.Configuration Man ...

  4. R: 数据结构、数据类型的描述。

    ################################################### 问题:数据结构..类型  18.4.27 有哪些数据结构.类型??  各自有什么特点? 解决方案 ...

  5. sublime text 侧边栏样式修改

    安装PackageResourceViewer 插件.快捷键 CTRL+SHIFT+P 打开 命令面板,输入 Package Control:Install Package (直接输入PCIP,四个单 ...

  6. Ubuntu的apt-get本地源搭配——根据需要自己添加软件作源

    试验机器:   Ubuntu 12.04.Lubuntu都可,其他版本应该也没问题,服务器ip:192.168.235.133     主机执行步骤:   1.在/var/cache/apt/arch ...

  7. 谈谈Java异常处理这件事儿

    此文已由作者谢蕾授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 前言 我们对于"异常处理"这个词并不陌生,众多框架和库在异常处理方面都提供了便利,但是对于 ...

  8. MATLAB进行无约束优化

    首先先给出三个例子引入fminbnd和fminuc函数求解无约束优化,对这些函数有个初步的了解 求f=2exp(-x)sin(x)在(0,8)上的最大.最小值. 例2 边长3m的正方形铁板,四角减去相 ...

  9. 对 React Context 的理解以及应用

    在React的官方文档中,Context被归类为高级部分(Advanced),属于React的高级API,但官方并不建议在稳定版的App中使用Context. 很多优秀的React组件都通过Conte ...

  10. android--系统路径获取

    Environment 常用方法: * 方法:getDataDirectory()解释:返回 File ,获取 Android 数据目录.* 方法:getDownloadCacheDirectory( ...