router-view 中包含 router-view 这种情况就可以 使用嵌套路由了

变化的视图中包含变化的视图

代码层面

  router-view 中 包含router-view

  路由children路由

nrm 管理npm 下载包的源,配置私有镜像源;

nrm ls 查看 npm 可供下载包的 地址

关闭vue项目 eslint 语法检测

 项目上线时的小细节

app.js 很大(至少1MB) 建议进行 代码 拆分。
app.js 很小(不到1MB) 也可进行 代码 拆分,但是当你路由跳转的时候,会多发一次HTTP的请求,这样式不是合理的。
合理使用 vue的异步组件 提升vue项目页面的性能
router>index.js
{
path: '/',
name: 'Home',
component: ()=>import('@/pages/home/Home')
},
{
path: '/city',
name: 'City',
component: ()=>import('@/pages/city/City')
},
{
path: '/detail/:id',
name: 'Detail',
component: ()=>import('@/pages/detail/Detail')
}, 局部组件 也异步组件拆分呢?
// import HomeHeader from './components/Header'
import HomeSwiper from './components/Swiper'
import axios from 'axios'
export default {
name: 'HOME',
components:{
HomeHeader:()=> import('./components/Header'),
HomeSwiper:HomeSwiper,
},

 如何查看 当前电脑vue cli 的版本

 vue -V
npm list --depth=0 -g
3 vue-cli 2.0 安装/卸载
  npm install vue-cli –g
  npm uninstall vue-cli -g
4 vue-cli 3.0 安装/卸载
  npm install -g @vue/cli
  npm uninstall @vue/cli -g
 vue --version 查看版本号

 vue-cli 3.0 安装

 vue create vue-sell-cube

最后一项 是问你 是否保存当前配置,如果你选了 yes ,以后安装都是 你这次安装的 配置选择,这里我选了 no;

安装完成后,它会提示下面2句话,跟vue-cli 2.0 不一样的是,npm run dev 换成了 npm run serve

1、cd vue-sell-cube
2、npm run serve
3、运行 npm run serve 如下图 本地访问 与 ip地址访问

vue-葵花宝典的更多相关文章

  1. Vue.js 和 MVVM 小细节

    MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使得ViewModel 的状态改变可以自 ...

  2. wepack+sass+vue 入门教程(三)

    十一.安装sass文件转换为css需要的相关依赖包 npm install --save-dev sass-loader style-loader css-loader loader的作用是辅助web ...

  3. wepack+sass+vue 入门教程(二)

    六.新建webpack配置文件 webpack.config.js 文件整体框架内容如下,后续会详细说明每个配置项的配置 webpack.config.js直接放在项目demo目录下 module.e ...

  4. wepack+sass+vue 入门教程(一)

    一.安装node.js node.js是基础,必须先安装.而且最新版的node.js,已经集成了npm. 下载地址 node安装,一路按默认即可. 二.全局安装webpack npm install ...

  5. Vue + Webpack + Vue-loader 系列教程(2)相关配置篇

    原文地址:https://lvyongbo.gitbooks.io/vue-loader/content/ 使用预处理器 在 Webpack 中,所有的预处理器需要和一个相应的加载器一同使用.vue- ...

  6. Vue + Webpack + Vue-loader 系列教程(1)功能介绍篇

    原文地址:https://lvyongbo.gitbooks.io/vue-loader/content/ Vue-loader 是什么? vue-loader 是一个加载器,能把如下格式的 Vue ...

  7. 关于Vue.js 2.0 的 Vuex 2.0,你需要更新的知识库

    应用结构 实际上,Vuex 在怎么组织你的代码结构上面没有任何限制,相反,它强制规定了一系列高级的原则: 应用级的状态集中放在 store 中. 改变状态的唯一方式是提交mutations,这是个同步 ...

  8. Vue.js 2.0 和 React、Augular等其他框架的全方位对比

    引言 这个页面无疑是最难编写的,但也是非常重要的.或许你遇到了一些问题并且先前用其他的框架解决了.来这里的目的是看看Vue是否有更好的解决方案.那么你就来对了. 客观来说,作为核心团队成员,显然我们会 ...

  9. 窥探Vue.js 2.0 - Virtual DOM到底是个什么鬼?

    引言 你可能听说在Vue.js 2.0已经发布,并且在其中新添加如了一些新功能.其中一个功能就是"Virtual DOM". Virtual DOM是什么 在之前,React和Em ...

  10. 初探Vue

    Vue.js(读音/vju:/,类似于view),是近来比较火的前端框架,但一直没有怎么具体了解.实现过,就知道个啥的MVVM啦,数据驱动啦,等这些关于Vue的虚概念. 由于最近,小生在公司中,负责开 ...

随机推荐

  1. [CSP-S模拟测试]:甜圈(线段树)

    题目描述 $D$先生,是一个了不起的甜甜圈制造商.今天,他的厨房准备在日出之前制作甜甜圈.$D$先生瞬间完成了$N$个油炸圈饼.但是,这些油炸圈饼得先经过各种装饰任务才可以成为甜甜圈销售:填充奶油,浸 ...

  2. 在getview方法中有三个参数,起到优化的部分为ViewHolder的使用,主要方法setTag(),getTag()

    适配器代码如下: public class Myadapter extends BaseAdapter { List<String> date; Context context; //构造 ...

  3. python中将12345转换为54321

    #将12345转换为54321 a = 12345789 ret = 0 #当a不为零的时候,循环条件为true,执行语句块 while a : #对a求余数,第一次循环则把5求出来 last = a ...

  4. C#-概念-类库:类库

    ylbtech-C#-概念-类库:类库 1.返回顶部 1. 类库(Class Library)是一个综合性的面向对象的可重用类型集合,这些类型包括:接口.抽象类和具体类.类库可以解决一系列常见编程任务 ...

  5. flutter 按键监听

    import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; void main() => ru ...

  6. php面向对象重的抽象类,接口类与静态

    static 静态 <?php class ren { public $name; public static $sex; static function shao() { echo " ...

  7. KEIL建立新唐MCU的工程时,移植官网程序报错变量未定义问题解决方法

    最近在使用新唐的MCU,新唐的MCU使用还算方便,你安装好KEIL之后再安装 Nu-Link_Keil_Driver_V3.00.6909 驱动即可建立新唐的MCU工程,注意的是因为新唐MCU是C51 ...

  8. ucenter 验证码看不到的解决办法

    ucenter 验证码看不到的解决办法,很简单,很实用,本人亲试成功~http://www.jinyuanbao.cn 把images /fonts /en 的ttf 刪除可以了!

  9. hdu6576Worker(最小公倍数)

    Problem Description Avin meets a rich customer today. He will earn 1 million dollars if he can solve ...

  10. openssl使用

    一. 加密方法 dsaffdfd fgggg 1.对称加密: 加密算法 + 口令 加密算法: DES(56bits),3DES(用des加密反复加密三次),AES(128bits),Blowfish ...