vue init webpack    项目名称

npm install axios                    //先安装!

npm install --save axios vue-axios   //然后!

npm install vuex --save              //安装vuex

npm i element-ui -S                        //安装vant,Ui框架,选择性安装

npm install babel-plugin-import -D            // 与element-ui是绑定安装关系

配置babelrc文件

{
"presets": [
[
"env",
{
"modules": false,
"targets": {
"browsers": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
}
],
"stage-2"
],
"plugins": [
"transform-vue-jsx",
"transform-runtime",
[
"component",
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]
],
"env": {
"test": {
"presets": [
"env",
"stage-2"
]
}
}
}

或者

  "plugins": [["component", [
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]]],

如果报错

npm install babel-plugin-component --save-dev

npm run dev

后台(一)vue+element-ui (按需加载)的更多相关文章

  1. vue中路由按需加载的几种方式

    使用vue-cli构建项目后,我们会在Router文件夹下面的index.js里面引入相关的路由组件,如: import Hello from '@/components/Hello' import ...

  2. vue 动态路由按需加载的三种方式

    在Vue项目中,一般使用vue-cli构建项目后,我们会在Router文件夹下面的index.js里面引入相关的路由组件,如: import Hello from '@/components/Hell ...

  3. vue项目实现按需加载的3种方式:vue异步组件技术、es提案的import()、webpack提供的require.ensure()

    1. vue异步组件技术 vue-router配置路由,使用vue的异步组件技术,可以实现按需加载. 但是,这种情况下一个组件生成一个js文件. 举例如下: { path: '/promisedemo ...

  4. vue项目实现按需加载的3种方式

    vue异步组件技术 vue-router配置路由,使用vue的异步组件技术,可以实现按需加载.这种方式下一个组件生成一个js文件 用例: { path: '/promisedemo', name: ' ...

  5. 35、element ui tab切换加载echarts不显示或显示不全问题解决:

    <el-tabs v-model="activeName" @tab-click="handleClick" type="border-card ...

  6. Vue性能优化之组件按需加载(以及一些常见的性能优化方法)

    关于Vue中的按需加载我就简单介绍一下:大概就是我们所有的东西都会在app.js里面,但是我们并不需要把所有的组件都一次性加载进来,我们可以在需要它的时候再将它加载进来,话不多说,开车! 1.webp ...

  7. vue router按需加载

    import Vue from 'vue' import Router from 'vue-router' Vue.use(Router); //按需加载,当渲染其他页面时才加载其组件,并缓存,减少首 ...

  8. route按需加载的3种方式:vue异步组件、es提案的import()、webpack的require.ensure()

    1. vue异步组件技术 vue-router配置路由,使用vue的异步组件技术,可以实现按需加载. 但是,这种情况下一个组件生成一个js文件.举例如下: { path: '/promisedemo' ...

  9. vue+element ui项目总结点(一)select、Cascader级联选择器、encodeURI、decodeURI转码解码、mockjs用法、路由懒加载三种方式

    不多说上代码: <template> <div class="hello"> <h1>{{ msg }}</h1> <p> ...

随机推荐

  1. python 之 前端开发(HTTP协议、head标签、img标签、a标签、列表标签)

    第十一章前端开发 11.1 HTTP 1.1引入了许多关键性能优化:keepalive连接,请求流水线,chunked编码传输,字节范围请求等 1.keepalive连接: 1.长连接允许HTTP设备 ...

  2. 『Python基础』第39节 函数的返回值

    1. 函数的返回值 ​ 一个函数就是封装一个功能, 这个功能一般都会有一个最终结果的. ​ 比如写一个登录的函数, 最终登录是否成功你总得告诉我一声吧? ​ 还有咱们之前也用过 len() 这个函数, ...

  3. Vue.js源码全方位深入解析--学习笔记

    模板中的插入变量是如何渲染到DOM上的? initMixin(Vue)->_init->$options-> $mount()当执行该挂载方法时DOM变化 为什么可以通过this访问 ...

  4. window服务器查看管理员列表

    快捷键win+R 输入cmd并进入 输入指令net localgroup administrators

  5. C#进阶系列——WebApi接口返回值类型详解

    阅读目录 一.void无返回值 二.IHttpActionResult 1.Json(T content) 2.Ok(). Ok(T content) 3.NotFound() 4.其他 5.自定义I ...

  6. 无重复字符串的最长子串 python

    给定一个字符串,请你找出其中不含有重复字符的 最长子串 的长度. 示例 1: 输入: "abcabcbb" 输出: 3 解释: 因为无重复字符的最长子串是 "abc&qu ...

  7. 攻防世界(Ctf-Web 新手练习区 Writeup)

    平台地址:adworld.xctf.org.cn 在打着暑假工赚零花钱之余,我将这些题利用空余时间刷了一遍,感觉内心还是比较满足的! 题目:view_source 这道题没啥好说的,在url的前面加上 ...

  8. iPhone电话与短信相关代码小结

    关于iPhone上电话与短信相关功能,做一个简单总结: 使用公开SDK能实现的功能: (1)获取和操作通讯录.使用函数 ABAddressBookRequestAccessWithCompletion ...

  9. 5.JUC之JDK自带锁ReentrantLock

    一.初识 ReentrantLock出身自jdk1.5,中文名:可重入锁 是Java JDK自带独占锁的唯一实现,是synchronized的升级版 1.我们之间有个synchronized 我们已经 ...

  10. 【robotframework】robotframework环境搭建

    一.基于python3.6环境 在dos命令输入 pip install robotframework 在线安装robotframework在dos命令输入 pip install Pypubsub= ...