关于在vue-cli脚手架中使用CDN引入element-ui不成功的坑
在前端开发过程中,为了减少最后打包出来的体积,我们会用到cdn引入一些比较大的库来解决。
常见我们引入的element-ui库,在最近使用cdn引入时,无论如何都引入不成功,其他的如Vue、vue-router、vuex、axios、echarts、crypto-js等等都能成功,就是element-ui死活不成功。在经过长达一个小时的苦思冥想后,在.babelrc文件中发现了蹊跷。
在之前配置element-ui时,根据官网提供的方法,配置了按需加载,如下:
{
"presets": [["@babel/preset-env", { "modules": false }]],
"plugins": [
[
"component",
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]
]
}
,然后果断把element-ui的按需加载移除掉,然后一切就OK了!!!!删除以后如下:
{
"presets": [["@babel/preset-env", { "modules": false }]]
// "plugins": [
// [
// "component",
// {
// "libraryName": "element-ui",
// "styleLibraryName": "theme-chalk"
// }
// ]
// ]
}
问题不大,就是之前自己根据官网配置的,忘记了,留下一笔,望大家少跳坑。
关于在vue-cli脚手架中使用CDN引入element-ui不成功的坑的更多相关文章
- 13. Vue CLI脚手架
一. Vue CLI 介绍 1. 什么是Vue CLI? Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.Vue CLI 致力于将 Vue 生态中的工具基础标准化.它确保了各种构建工 ...
- vue.js---利用vue cli脚手架工具+webpack创建项目遇到的坑
1.Eslint js代码规范报错 WARNING Compiled with 2 warnings 10:43:26 ✘ http://eslint.org/docs/rules/quotes St ...
- vue Cli 按需引入Element UI 和全局引用Element UI
全局引用: 一.安装 Element UI npm i element-ui -S 二.在main.js 中引入 element UI import ElementUI from 'element-u ...
- vue.cli脚手架初次使用图文教程
vue-cli作用 vue-cli作为vue的脚手架,可以帮助我们在实际开发中自动生成vue.js的模板工程. vue-cli使用 !!前提:需要vue和webpack 安装全局vue-cli npm ...
- Vue CLI 3 中文文档
翻译文档 文档翻译全貌 前言 之前写了一篇Vue CLI 3.x 版本的简单体验,当时文档还不全,具体的使用方法并不是很清楚,大概是2月7号,收到Vue CLI 3接近Beta版的提示,作者尤雨溪也讲 ...
- vue cli脚手架使用
1.安装nodejs,npm https://www.cnblogs.com/xidianzxm/p/12036880.html 2.安装vue cli sudo npm install -g @vu ...
- 使用Vue CLI脚手架搭建vue项目
本次是使用@vue/cli 3.11.0版本搭建的vue项目 1. 首先确保自己的电脑上的Node.js的版本是8.9版本或者以上 2. 全局安装vue/cli npm install @vue/cl ...
- node.js和vue cli脚手架下载安装配置方法
一.node.js安装以及环境配置 1.下载vue.js 下载地址: https://nodejs.org/en/ 2.安装node.js 下载完成后,双击安装包开始安装.安装地址最好换成自己指定的地 ...
- vue cli搭建项目及文件引入
cli搭建方法:需安装nodejs先 1.npm install -g cnpm --registry=https://registry.npm.taobao.org //安装cnpm,用cnpm下载 ...
随机推荐
- C++基础之顺序容器
顺序容器简介: 顺序容器类型 描述 vector 可变大小数组,支持快速访问,在尾部之外的地方插入或删除时可能很慢 deque 双端队列.支持快速访问,在头尾插入删除会很快. list 双向列表.只支 ...
- 暑期——第九周总结(1,林子雨老师关于hdfs eclipse案例报错问题【已解决】)
所花时间:7天 代码行:1000(Java)+500(Python)+300(C++) 博客量:1篇 了解到知识点 : 一: 解决"Class org.apache.hadoop.hdfs. ...
- Android [SharedPreference轻量级存储]
SharedPreferencesActivity.java package com.xdw.a122.data; import android.content.SharedPreferences; ...
- 深度学习论文翻译解析(五):Siamese Neural Networks for One-shot Image Recognition
论文标题:Siamese Neural Networks for One-shot Image Recognition 论文作者: Gregory Koch Richard Zemel Rusla ...
- asp.net core IdentityServer4 实现 implicit(隐式许可)实现第三方登录
前言 OAuth 2.0默认四种授权模式(GrantType) 授权码模式(authorization_code) 简化模式(implicit) 密码模式(resource owner passwor ...
- jQuery九大选择器和jQuery对ajax的支持
一.jQuery九大选择器 1)基本选择器: <body> <div id="div1ID">div1</div> <div id=&qu ...
- 使用XAMPP配置Apache服务器反向代理
反向代理(Reverse Proxy)方式是指以代理服务器来接受internet上的连接请求,然后将请求转发给内部网络上的服务器,并将从服务器上得到的结果返回给internet上请求连接的客户端,此时 ...
- gitbook 入门教程之从零到壹发布自己的插件
什么是插件 Gitbook 插件是扩展 Gitbook 功能的最佳方式,如果 Gitbook 没有想要的功能或者说网络上也没有现成的解决方案时,那么只剩下自食其力这条道路,让我们一起来自力更生开发插件 ...
- 实际体验华为云AI : ModelArts
国庆前看到了博客园官方博客发布的一篇博客: 学AI有奖:博客园&华为云AI有奖训练营开战啦 本着对AI这种火热的话题,以及华为云博客园联名公仔(次要),我决定参与这个活动. 现在华为云开始全面 ...
- 你应该知道的简单易用的CSS技巧
作为前端,在工作中难免会遇到关于排版的问题,以下是我整理的一些关于CSS的技巧,希望对你能有帮助. 1.每个单词的首字母大写 一般我们会用JS实现,其实CSS就可以实现. JS代码: var str ...