1.下载node最新稳定版本，并且安装

2.安装好之后，在cmd或者terminal下， 使用npm -v 查看当前npm版本，验证是否安装成功

3.安装成功后，运行 npm i -g @vue/cli 来安装 vue3.0脚手架。安装成功后使用 vue -V查看当前版本，验证是否安装成功

4.vue-cli搭建基础项目： 以搭建一个项目名称为vue-test的vue前端项目为例

5.在终端下输入以下命令 ： vue create + 你的项目名称

6.根据提示进行相应的配置，选取必要的模块

 

7.选择项目需要的一些特性（此处我们选择需要Babel编译、使用Vue路由、Vue状态管理器、CSS预处理器、代码检测和格式化）

 

8.选择路由模式，在这里我们选择兼容性比较好的哈希模式

 

9.选择css预处理语言，在这里我们选择兼容广泛的stylus

 

10.选择ESlint代码规范，此处使用standard代码规范

 

11.选择何时启用lint格式化，在这里我们选择保存的时候

 

12.配置信息分开保存还是单独一个文件保存，我们选择分开保存

 

13.是否将当前设置作为预设，选择否

 

14.项目生成中

 

15.配置完成后Vue-cli完成初始化

 

16.初始化完成后，根据提示进入到vue-test项目中，并启动项目

17.   进入到vue-test项目cd vue-test

       启动服务npm run serve

       打包编译npm run build

 

vue3.0脚手架 创建项目的更多相关文章

  1. vue-cli3.0 脚手架搭建项目的过程详解

    1.安装vue-cli 3.0 ? 1 2 3 npm install -g @vue/cli # or yarn global add @vue/cli 安装成功后查看版本:vue -V(大写的V) ...

  2. 七天接手react项目 系列 —— react 脚手架创建项目

    其他章节请看: 七天接手react项目 系列 react 脚手架创建项目 前面我们一直通过 script 的方式学习 react 基础知识,而真实项目通常是基于脚手架进行开发. 本篇首先通过 reac ...

  3. Vue.js用脚手架创建项目

    安装全局脚手架 cnpm install vue-cli -g vue --version 用脚手架创建项目 创建项目 运行项目 停止项目:Ctrl+C 修改端口 config - index.js ...

  4. Koa 脚手架创建项目

    Koa 脚手架创建项目 通过应用 koa 脚手架生成工具 可以快速创建一个基于 koa2 的应用的骨架 全局安装koa npm install koa-generator -g //必须安装到全局 创 ...

  5. vue-cli 3.0脚手架创建vue项目

    1. 卸载vue-cli 2.0 npm uninstall -g vue-cli 2. 安装vue-cli 3.0 npm install @vue/cli 3. 创建项目 npm create & ...

  6. Vue3.0脚手架搭建

    https://www.jianshu.com/p/fbcad30031c2 vue3.0官网:https://cli.vuejs.org/zh/guide/ 介绍: notice: 这份文档是对应 ...

  7. 使用vue-cli脚手架创建项目

    ue-cli 是一个官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目. GitHub地址是:https://github.com/vuejs/vue-cli 一.安 ...

  8. 小白6步搞定vue脚手架创建项目

    1.安装node及npm node -v (测试node是否安装成功)npm -v(测试npm是否安装成功) 2.安装cnpm npm install -g cnpm --registry=http: ...

  9. vue-cli3.0 脚手架搭建项目

    1.安装vue-cli 3.0 npm install -g @vue/cli # or yarn global add @vue/cli 安装成功后查看版本:vue -V(大写的V) 2.命令变化 ...

随机推荐

  1. 99%的人都理解错了GET与POST的区别

    原文链接:https://mp.weixin.qq.com/s?__biz=MzI3NzIzMzg3Mw==&mid=100000054&idx=1&sn=71f6c214f3 ...

  2. Linux下载安装mysql5.7教程

    首先下载mysql 的安装包,可以去官网下载,网址:https://dev.mysql.com/downloads/mysql/ 然后下滑,在这个地方选择你想要安装的版本: 这里我选择的5.7.点击进 ...

  3. 深入理解 Css3 的 clip-path

    clip-path CSS 属性可以创建一个只有元素的部分区域可以显示的剪切区域.区域内的部分显示,区域外的隐藏.clip-path属性代替了现在已经弃用的剪切 clip属性.clip-path的属性 ...

  4. js实现放烟花效果——点击处会从下向上升起烟花

    一个box中,点击其中的任意位置,会有烟花从正下方升起到点击处,并燃放出一圈圆形的烟花.代码如下: 首先是布局以及样式: <style> .box{ width: 1100px; heig ...

  5. python学习-28 map函数

    1. num_1 = [10,2,3,4] def map_test(array): ret = [] for i in num_1: ret.append(i**2) # 列表里每个元素都平方 re ...

  6. 强类型c语言 类型

    C 语言是一门强类型的语言,类型决定语言的特性,允许在相同类型进行运算. *强类型语言的特点:      1      先声明,后使用. 2      类型不可变. * 基本数据类型 * 数据类型的范 ...

  7. zookeeper-data

    1. The ZooKeeper Data Model 1.1 ZNodes Znodes maintain a stat structure: The Stat structure for each ...

  8. 创客课堂——Scratch的操作界面

    大家好,这里是蓝精灵创客公益课堂,我是蓝老师 上期我们了解了scratch软件进行了简单的了解,很多朋友都已经按照上期方法下载安装好了软件. 那么今天蓝老师就和大家一起认识下Scratch的操作界面及 ...

  9. 如何使用JavaScript实现纯前端读取和导出excel文件（转）

    转自小茗同学博客:https://www.cnblogs.com/liuxianan/p/js-excel.html js-xlsx 介绍 由SheetJS出品的js-xlsx是一款非常方便的只需要纯 ...

  10. Http 与 Https区别

    传统Http协议弊端 传统Http协议弊端是明文的,如果别人采用抓包分析可以获取到明文数据. 什么是Https协议 HTTPS(Hyper Text Transfer Protocol over Se ...