安装

  • Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。你可以使用 nvm 或 nvm-windows在同一台电脑中管理多个 Node 版本。

    检查node版本:

    $ node -v
    v8.9.3

  • 关于旧版本

    Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。 如果你已经全局安装了旧版本的 vue-cli(1.x 或 2.x),

    通过 npm uninstall vue-cli -g  卸载它。

  • 安装vue-cli3

    

    

    

    npm install -g @vue/cli

     装之后,你就可以在命令行中访问 vue 命令。你可以通过简单运行 vue,看看是否展示出了一份所有可用命令的帮助信息,来验证它是否安装成功。

    检查其版本是否正确 (3.x):vue --version

创建项目 

    

    vue create vue-sell-cube  【vue-sell-cube】是项目名称


进入项目

       cd vue-sell-cube 


运行项目

    npm run serve

运行成功

项目简单多了

node_modules 底层依赖webpack 配置

入口html在文件夹【public】- 【index.html】

源码都在文件夹【src】中,入口js是main.js; 入口html会加载main.js,main.js 会对vue初始化

安装vue-cli-plugin-cube-ui

  https://github.com/cube-ui/vue-cli-plugin-cube-ui

  命令:vue add cube-ui

以上安装内容说明见官网:https://github.com/cube-ui/cube-template/wiki 

安装成功后文件会被部分修改,如下:

cube-ui.js是引入cube-ui的所有组件,后续开发成功后可以删除不必要的组件

theme.styl 是所有组件的颜色

package.json

    

main.js

 前后端分离 - 接口 - 见【Mock数据】- 模拟访问数据

 

【1】vue/cli 3.0 脚手架 及cube-ui 安装的更多相关文章

  1. Vue CLI 3.0脚手架如何在本地配置mock数据

    前后端分离的开发模式已经是目前前端的主流模式,至于为什么会前后端分离的开发我们就不做过多的阐述,既然是前后端分离的模式开发肯定是离不开前端的数据模拟阶段. 我们在开发的过程中,由于后台接口的没有完成或 ...

  2. vue/cli 3.0脚手架搭建

    在vue 2.9.6中,搭建vue-cli脚手架的流程是这样的: 首先 全局安装vue-cli,在cmd中输入命令: npm install --global vue-cli  安装成功:  安装完成 ...

  3. vue/cli 3.0 脚手架【进阶】 使用 amfe-flexible 和 postcss-px2rem进行移动端适

    安装vue-cli3   npm install -g @vue/cli 创建项目 vue-cli-test 脚手架-项目-成功-运行项目 基于vue-cli配置移动端自适应 转自:http://hj ...

  4. 基于vue cli 3.0创建前端项目并安装cube-ui

    前提条件: 安装node.js. 国内的开发者最好先配置淘宝镜像. 之后用cnpm来代替npm命令. 项目创建过程: 打开cmd,输入命令进入目标工作空间,以本机项目为例: cd /d d: cd D ...

  5. @vue/cli 3.0 使用 svg-sprite-loader 加载本地 SVG 文件

    目录 @vue/cli 3.0 使用 svg-sprite-loader 加载本地 SVG 文件 运行 使用 配置 svg-sprite-loader 调用当前环境下的颜色 props @vue/cl ...

  6. 专访Vue作者尤雨溪:Vue CLI 3.0重构的原因

    1.为什么要对 Vue CLI 进行大规模修改? 尤雨溪认为旧版本的 Vue CLI 本质上只是从 GitHub 拉取模版,这种拉模版的方式有几个问题: (1) 在单个模版里面同时支持太多选项会导致模 ...

  7. vue cli 4.0.5 的使用

    vue cli 4.0.5 的使用 现在的 vue 脚手架已经升级到4.0的版本了,前两日vue 刚发布了3.0版本,我看了一下cli 4 和cli 3 没什么区别,既然这样,就只总结一下vue cl ...

  8. 如何使用@vue/cli 3.0在npm上创建,发布和使用你自己的Vue.js组件库

    译者按: 你可能npm人家的包过成千上万次,但你是否有创建,发布和使用过自己的npm包? 原文: How to create, publish and use your own VueJS Compo ...

  9. VUE CLI 3.0 安装及创建项目

    一.安装 VUE CLI 3.0 官网: https://cli.vuejs.org/   详细资料可以自己先把官网过一遍. 1. 安装(默认你的电脑上已安装node及npm) npm install ...

随机推荐

  1. 【代码审计】QYKCMS_v4.3.2 前台存储型XSS跨站脚本漏洞分析

      0x00 环境准备 QYKCMS官网:http://www.qykcms.com/ 网站源码版本:QYKCMS_v4.3.2(企业站主题) 程序源码下载:http://bbs.qingyunke. ...

  2. NUC972----最简单的驱动(转)

    1.新建文本文档,重命名为 hello_dev.c (驱动的开发同应用的开发一样,也是在文本文档下开发的). 2.包含头文件 内核模块需要包含内核相关头文件,不同模块根据功能的差异,所需要的头文件也不 ...

  3. [原]openstack-kilo--issue(十八) Error parsing template file: Template format version not found.

    在创建stack的时候出现的报错: ]# heat stack-create nems_demo -e AAA.yaml -f AAA.parameter.yaml Error parsing tem ...

  4. [原]openstack-kilo--issue(十五) WARNING keystonemiddleware.auth_token Authorization failed for token Could not find token

    在创建vm的时候在controller node报错: -- :: INFO neutron.wsgi [req-a815cde4-f49c-4d23-b9c3-030bfc2a75d4 ] /Jan ...

  5. python3之枚举

    枚举 li = ['a','b','c','d'] for index,i in enumerate(li): #for index,i in enumerate(li,100): print(ind ...

  6. 阿里云不同账号之间相同地域的VPC网络互访

    今天实际操作了一下,在这篇随笔中记录一下以备忘,主要参考阿里云帮助文档-不同账号下专有网络内网互通. 实现场景:账号A的VPC网络中的ECS访问账号B的VPC网络中的ECS与RDS(地域都在华东1), ...

  7. [No0000EA]C# 可空类型(Nullable)

    C# 可空类型(Nullable) C# 提供了一个特殊的数据类型,nullable 类型(可空类型),可空类型可以表示其基础值类型正常范围内的值,再加上一个 null 值. 例如,Nullable& ...

  8. VS在解决方案中添加一个别人给的项目,我自己的项目主窗体中不能调用

    提示缺少Using引用,我在主窗体中已经写了Using XX,还是提示“未能找到类型或命名空间名“ XX”(是否缺少Using指令或程序集引用?)”,以前只要Using 一下就好了,后来想了一下,要在 ...

  9. nslookup dig iptables,sudoer,jenkins

    [NSLOOKUPm]http://roclinux.cn/?p=2441 nslookup media.ucampus.unipus.cn [DIG]http://roclinux.cn/?p=24 ...

  10. [skill][c][ld][gcc] 明确指定gcc在链接时明确使用静态库

    通常,我们这样链接: gcc -o a.out -L/usr/lib/ -ltest a.o 这样它会链接动态库 libtest.so,  可是有时候我们想在静态库与动态库同时存在时,优先使用静态库. ...