Vue-cli3使用VUE项目管理器新建一个项目

前端技术栈:Vue,Vue-Router,Element-UI,Axios,Echarts

Vue-cli3脚手架安装

1.安装node.js
到官网选择对应版本下载link,然后无脑安装

2.安装淘宝镜像
打开命令行窗口
输入npm install -g cnpm --registry=https://registry.npm.taobao.org
详细可在菜鸟教程看link

3.npm安装vue-cli
cmd执行©npm install-g @vue/cli(不用淘宝镜像可忽略前面的"c"),安装vue-cli3(3开始安装方式改为这个)。
在命令行输入 vue -V出现相应的版本,即说明安装成功

打开VUE项目管理器

打开命令行,输入vue ui 此时会自己跳到浏览器打开界面

  • 点击创建项目(可现在本地创建好要存放项目的文件夹,再选择这个文件夹)
    在这里插入图片描述
  • 填写项目名称,如果要上传到github则勾选
    在这里插入图片描述
  • 选择手动配置项目,也可以选择已有的预设,第一套是我自己写过的项目
    在这里插入图片描述
  • 够选下面4个选项,根据自己的情况选择
    在这里插入图片描述
  • 配置,Eslint选择标准配置
    在这里插入图片描述
  • 可以起名保存预设,下次创建项目就有你配置过的预设了,像第一张图片那样。
    在这里插入图片描述
  • 点击创建项目,便创建成功。
    在这里插入图片描述

手动配置

以下不做图文说明,发现太长了

  • 安装 vue-cli-plugin-element
    点击插件–>添加插件–>在搜索栏输入vue-cli-plugin-element–>点击安装
    安装完成后可以选择全部导入或按需导入,一般选按需导入Import on demand

  • 配置Axios:在依赖中安装,搜索axios(运行依赖)

      项目就基本配置完成了
      接下来点击任务-->server-->运行
      运行后点击启动app就可出现如下画面
    

在这里插入图片描述
下面就可以随心所欲的按需求写项目了。

Logo

Vue社区为您提供最前沿的新闻资讯和知识内容

更多推荐