1、首先要安装vue-cli 3.0以上版本,和git 该版本可以支持页面化快速创建:

  sudo npm install -g @vue/cli

  安装完毕后查看vue版本信息:vue -V

2、安装好vue-cli 3.X后,就可以通过vue ui来进入项目创建页面了

创建页面如下:

3、该页面会检索到本机所有vue项目,我们通过创建,来新增项目,创建步骤按需增加,例如增加必要的插件,包管理我习惯用了npm

PS:预设表示的是将以上配置操作保存起来,以后可以直接通过这个配置文件来创建项目

点击创建项目,终端开始下来依赖包

4、上面操作完毕后,项目搭建完成

5、终端运行:

    npm run serve 项目启动 

Vue-admin工作整理(一):项目搭建的更多相关文章

  1. vue开发(开发环境+项目搭建)

    Vue.js是一套构建用户界面的渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合.另一方面,Vu ...

  2. vue.js的手脚架vue-cli项目搭建的步骤

    手脚架是什么? 众所周知,现在的前端项目发展得越渐越大,我们前端程序员要从0开始去搭建一套完整的项目很费时,所以这时候前端工程的手脚架就出现了. 我用得vue-cli也是其中之一,还有其他的我也说不清 ...

  3. Win10中Vue.js的安装和项目搭建

    一. 提前准备工作 1.Node.js环境 2.Windows10 3.npm(前端包管理工具) 4.webpack(前端资源加载/打包工具) 二. 开始安装 1..下载并安装Node.js 下载地址 ...

  4. vue学习(一)项目搭建

    首先需要配置node和npm,如果没有安装的话,百度一下安装教程. 如果感觉npm下载速度慢,可以使用淘宝镜像cnpm,链接地址: http://npm.taobao.org/ 安装cnpm npm ...

  5. Vue-admin工作整理(二):项目结构个人配置

    通过上一篇文章(Vue-admin工作整理(一):项目搭建)操作完毕后,基础项目已经搭建,下面就要对项目本身进行一下项目结构调整来符合自己的项目要求 1.首先要对package.json文件进行调整, ...

  6. requirejs + vue 项目搭建

    以前都是支持 司徒正美 的,毕竟咱们也是跟着 司徒正美 一起走进了前端的世界.所以一般MVVM都是用avalon的,当然也是考虑到项目需要支持IE6,7,8的考虑.当然在用的时候也有一些小坑和bug, ...

  7. Vue + Element-ui实现后台管理系统(2)---项目搭建 + ⾸⻚布局实现

    项目搭建 + ⾸⻚布局实现 上篇对该项目做了个总述 :Vue + Element-ui实现后台管理系统(1) --- 总述 这篇主要讲解 项目搭建 + 后台⾸⻚布局实现 : 整体效果 后台首页按布局一 ...

  8. requirejs + vue 项目搭建2

    上篇是年后的项目搭建的,时间比较仓促,感觉有点low 1.gulp-vue 文件对公用js的有依赖,以后别的同事拿去搭其他项目,估计会被喷 2.不支持vue-loader一样写模版语言和es6语法 最 ...

  9. Vue项目搭建完整剖析全过程

    Vue项目搭建完整剖析全过程 项目源码地址:https://github.com/ballyalex 有帮助的话就加个星星呗~!  项目技术栈:vue+webpack+bower+sass+axios ...

随机推荐

  1. 解决webpack打包报错: Cannot find module '@webassemblyjs/wasm-parser'

    出现这个错误时,百度和谷歌中都搜索不出个所以然出来,后来看了一下webpack官网,说建议安装node最新版本: 前提条件 在开始之前,请确保安装了 Node.js 的最新版本.使用 Node.js ...

  2. 一次完整的http请求过程

    转载:https://blog.51cto.com/linux5588/1351007 当我们在浏览器的地址栏输入 www.linux178.com,然后回车,回车这一瞬间到看到页面到底发生了什么呢? ...

  3. minikube windows hyperx填坑记

    minikube windows hyperx填坑记 安装了一天半,还是没行,先放弃 开始 minikube start --vm-driver=hyperv --hyperv-virtual-swi ...

  4. C# 按不同的字节编码,通过字节数去截取字符串

    /// <summary> /// 按不同的字节编码,通过字节数去截取字符串 /// 数据库UTF-8 1个数字.字母.英文符号算1个长度 1个中文.中文符号算3个长度 /// </ ...

  5. python绘制中文词云图

    准备工作 主要用到Python的两个第三方库 jieba:中文分词工具 wordcloud:python下的词云生成工具 步骤 准备语料库,词云图需要的背景图片 使用jieba进行分词,去停用词,词频 ...

  6. 《linux就该这么学》第十六节课:第16,17章,Squid服务和iscsi网络存储

    第十六章 squid总结: 正向代理:yum  安装后清空防火墙即可正常使用,客户端设置浏览器 透明正向代理:vim  /etc/squid/squid.conf 59行:http_port  312 ...

  7. PS跑马灯效果和更换图标

    最终效果     1.图片修改   跑马灯效果图 Head页面 使用的 IScript_HPDefaultHdr() in WEBLIB_PORTAL.PORTAL_HOMEPAGE 这个页面   一 ...

  8. Python练习:爬取图片

    贴吧地址 https://tieba.baidu.com/p/5272413637?red_tag=0606091703 程序如下import urllib.requestimport re def ...

  9. sitecore8.2 基于item路径查询item

    查询: query:/sitecore/content/home/foo/bar 结果 bar

  10. 最简单的 react-router4 的安装和使用

    React-Router 的安装  npm install react-router React-Router提供了两个组件:Router和Route.下面看最简单的例子: src/Routes.js ...