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. 机器学习-LDA主题模型笔记

    LDA常见的应用方向: 信息提取和搜索(语义分析):文档分类/聚类.文章摘要.社区挖掘:基于内容的图像聚类.目标识别(以及其他计算机视觉应用):生物信息数据的应用; 对于朴素贝叶斯模型来说,可以胜任许 ...

  2. Python复习笔记01

    (1)计算机常识 计算机:硬件(运算器,控制器,存储器,输入设备,输出设备)软件 (系统软件, 应用软件) 二进制 整数存储 文件单 位换算 1Byte = 8bit 1KB = 1024Byte 1 ...

  3. WxWidgets与其他工具包的比较(15种方案)

    一些一般注意事项: wxWidgets不仅适用于C ++,而且具有python,perl,php,java,lua,lisp,erlang,eiffel,C#(.NET),BASIC,ruby甚至ja ...

  4. 查看php和apache配置成功的方法

    PHP配置文件是php.ini  检查php是否配置成功,在wamp/www根目录写一个phpinfo.php文件,内容为 <?php phpinfo(); ?>  然后可以打开网页输入l ...

  5. Code First 下自动更新数据库结构(Automatic Migrations)

    示例 Web.config <?xml version="1.0" encoding="utf-8"?> <configuration> ...

  6. 初试牛刀:实时天气WebService

    1.引入WebService:http://www.webxml.com.cn/WebServices/WeatherWebService.asmx 2.声明接口→界面获取值传入接口→接口返回值处理→ ...

  7. javascript序列化表单追加参数

    js序列化表单后追加参数方式: 追加参数:token,status var data = $.param({"token":token, "status":st ...

  8. Go 关于 kafka 的生产者、消费者实例

    zookeeper + kafka 首先要在 apche 官网下载 kafka 的程序包(linux版本),然后放到服务器上解压,得到以下目录 bin 目录下包含了服务的启动脚本 启动 zookeep ...

  9. iOS音频学习笔记三:音频会话管理

    ​      使用Audio Session API ,可以指定App需要的音频行为,比如,当播放音频时,使得其他应用App静音或者混和在一起,也可以指定当App的音频被中断(例如被电话)时的行为,还 ...

  10. orangepi香橙派安装VNC Viewer远程桌面

    用ssh连接实在没有图形界面操作的好,虽然命令会快,但是很多命令都记不住. 第一步: sudo apt-get install xfce4 第二步: sudo apt-get install vnc4 ...