后台(一)vue+element-ui (按需加载)
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 (按需加载)的更多相关文章
- vue中路由按需加载的几种方式
使用vue-cli构建项目后,我们会在Router文件夹下面的index.js里面引入相关的路由组件,如: import Hello from '@/components/Hello' import ...
- vue 动态路由按需加载的三种方式
在Vue项目中,一般使用vue-cli构建项目后,我们会在Router文件夹下面的index.js里面引入相关的路由组件,如: import Hello from '@/components/Hell ...
- vue项目实现按需加载的3种方式:vue异步组件技术、es提案的import()、webpack提供的require.ensure()
1. vue异步组件技术 vue-router配置路由,使用vue的异步组件技术,可以实现按需加载. 但是,这种情况下一个组件生成一个js文件. 举例如下: { path: '/promisedemo ...
- vue项目实现按需加载的3种方式
vue异步组件技术 vue-router配置路由,使用vue的异步组件技术,可以实现按需加载.这种方式下一个组件生成一个js文件 用例: { path: '/promisedemo', name: ' ...
- 35、element ui tab切换加载echarts不显示或显示不全问题解决:
<el-tabs v-model="activeName" @tab-click="handleClick" type="border-card ...
- Vue性能优化之组件按需加载(以及一些常见的性能优化方法)
关于Vue中的按需加载我就简单介绍一下:大概就是我们所有的东西都会在app.js里面,但是我们并不需要把所有的组件都一次性加载进来,我们可以在需要它的时候再将它加载进来,话不多说,开车! 1.webp ...
- vue router按需加载
import Vue from 'vue' import Router from 'vue-router' Vue.use(Router); //按需加载,当渲染其他页面时才加载其组件,并缓存,减少首 ...
- route按需加载的3种方式:vue异步组件、es提案的import()、webpack的require.ensure()
1. vue异步组件技术 vue-router配置路由,使用vue的异步组件技术,可以实现按需加载. 但是,这种情况下一个组件生成一个js文件.举例如下: { path: '/promisedemo' ...
- vue+element ui项目总结点(一)select、Cascader级联选择器、encodeURI、decodeURI转码解码、mockjs用法、路由懒加载三种方式
不多说上代码: <template> <div class="hello"> <h1>{{ msg }}</h1> <p> ...
随机推荐
- C 语言字符串的比较
C 语言字符串的比较 #include <stdio.h> #include <Windows.h> #include <string.h> int main(vo ...
- go 数据渲染到html页面 02
渲染到浏览器页面 //把数据渲染到浏览器 package main import ( "fmt" "text/template" "net/http& ...
- PB在已经存在的datawindow中添加数据列的方法
打开数据窗口,点击Data按钮 进入到数据源定义画板,选择要新增的列后,不要保存文件,直接点关闭,在提示框选是就可以了 新增的列值存不到数据库中,如果需要更新数据库中的值则:需要在数据窗口画板下,点击 ...
- 我们为什么要用redis
Redis的5要点: 1.为什么要选择Redis:介绍Redis的使用场景与使用Redis的原因: 2.Redis常用命令总结:包括时间复杂度总结与具体数据类型在Redis内部使用的数据结构: 3.R ...
- iOS - 数据存储方式(本地化)
iOS中数据存储方式 一般使用以下4种:(已更新) .NSKeyedAchiever//序列化 存放对象 .NSUserDefaults//本质是plist存储 NSData.NSString.NSN ...
- 【转载】 C#使用String.Format拼接字符串
在C#程序开发过程中,很多时候会使用字符串拼接,最简单的字符串拼接操作就是所有的字符串使用加号+相加连接起来,但这种代码形式非常不适合代码维护阅读,尤其是拼接字符串语句比较复杂的时候,如拼接SQL语句 ...
- arm9的操作模式,寄存器,寻址方式
工作模式 Arm有7种工作模式: 名称 简称 简介 User Usr 正常用户程序执行的模式(linux下用户程序就是在这一模式执行的.) FIQ Fiq 快速中断模式 IRQ Irq 普通中断模式 ...
- linux文件比较
Linux文件比较指令有两个,comm和diff,其中comm要求的是排序过得文件.Diff则没有这个要求,diff的输出结果主要是用来表明文件一经过怎样的修改可以得到文件二. Comm Comm的语 ...
- {T4模板}C# Net MVC+SqlServer=T4模板生成实体类并操作数据(DbHelper+DBManage)
1.ConnectionString,数据库链接 Web.config <configuration> <connectionStrings> <!-- 数据库 SQL ...
- 【故障处理】-OGG 丢失归档20190717
再次遇到OGG 异常: 归档丢失,OGG 不能找到需要的归档文件. 该表完整expdp 导出评估为 110G,了解到只有插入操作,所以只把归档丢失期间的数据补到目标端就好. 1. 清理目标端 2019 ...