vuecli3 external的一个注意事项

最新推荐文章于 2024-01-30 10:17:41 发布
最新推荐文章于 2024-01-30 10:17:41 发布
阅读量1.2k 收藏
点赞数
分类专栏： 前端 文章标签： vue.js javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/cpa0701/article/details/108522931
版权

之间有写过一篇external和import,package.json的关系
项目中有一个tui-editor的依赖，然后目前external是这样配置的
在这里插入图片描述
把jquery给排除了

坑来了！！！！

由于tui-editor中依赖了jquery，那么在打包时便会导致部分代码不生效，关键是tui-editor运行时也不报错，一直以为是babel的问题。。。。。
之后将jquery不加入externals中，恢复正常
总结：
如果项目中有第三方依赖用到了externals中的依赖，那么最好还是不要将其排除

AwesomeCPA
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue3.0 webpack采用externals进行cdn优化
weixin_46605745的博客
02-23 1158
第一步 在vue.config.js文件内的configureWebpack方法内写入externals configureWebpack: { // provide the app's title in webpack's name field, so that // it can be accessed in index.html to inject the correct title. name: name, resolve: { alias: {
前端性能优化《一》：vue-cli3中使用external进行cdn配置
sixam的博客
05-11 8917
不过使用externals属性要注意的是，虽然可以优化首屏加载速度，但是由于静态资源分离，也会增加http请求数量。所以如果是小项目，最好就不要用externals属性，因为小项目打包的出来的vender.js体积不大，建议项目体量较大的项目再用比较合适。
vue3使用 vue-grid-layout报错：external_commonjs_vue_commonjs2_vue_root_Vue_default.a is not a constructor
ping
11-10 3817
提示： 解决： 第一步： npm add vue-grid-layout@3.0.0-beta1 第二步： mian.js里引入： import VueGridLayout from ‘vue-grid-layout’ 加入：.use(VueGridLayout) createApp(App).use(axios).use(router).use(VueGridLayout).mount('#app') 因为vue-grid-layout是vue2版本的 但自己用的是vu...
vue-cli3配置externals、jquery
solocao的专栏
09-05 2009
在index.html引入 <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.10.0/jquery.js"></script> 配置文件 vue.config.js 代码如下： module.exports = { configureWebpack:{ externals: { 'jquery' : '$', } }, };
Vue cli 引入第三方JS和CSS的常用方法分享
01-19
第一种方法： 直接在index.html中引入 js [removed][removed] css <link rel=stylesheet href=static/mui.min.css rel=external nofollow /> 第二种 在单页面中用import方法导入 js import mui from '../...
vue-cli脚手架引入弹出层layer插件的几种方法
01-19
在vue-cli里，引入文件有几钟方法 一种是用npm或者cnpm指令去下载对应的插件，然后在main.js里用import方法引入，这里不讨论这种方法 我比较喜欢采用的是直接下载对应的js，然后引入到vue项目中去 问题来了，如何...
Vue组件中的data必须是一个function的原因浅析
12-02
组件可以有自己的data，并且data必须是一个function。 在下面这个例子中，data 返回了一个在外部定义的对象。并且这个组件在页面中使用了3次，点击+1时出现了如下情况：data中的count属性影响到了所有实例。 <...
vue+iview写个弹框的示例代码
11-27
iView 是一套基于Vue.js的开源UI组件库，主要服务于PC界面的中后台产品。 1、iView的特性 1) 高质量、功能丰富 2) 友好的API ，自由灵活地使用空间 3) 细致、漂亮的 UI 4) 事无巨细的文档 5) 可自定义主题 2、...
在vue-cli的组件模板里使用font-awesome的两种方法
01-19
方法一： npm install font-awesome 在main.js里添加import ‘font-awesome/css/font-awesome.css’ 方法二： 在官网下载代码到本地，现在应该是font-awesome-4.7，把整个文件夹放到static文件夹中，然后在index....
Vue 打包优化之 externals 抽离公共的第三方库
天问博客-专注于大前端技术
11-29 3215
使用 @vue/cli 脚手架构建的 Vue 全家桶项目，默认配置下，打包后会把 vue、vue-router、axios、vuex、element-ui、echarts 等公共库打包在一起，导致基础 chunk、vendor 包体积特别大，有时一个文件能达到 3-5MB，这会大大影响首次加载速度。因此需要抽离第三方公共库，配合使用 CDN 加速。
Vue3,VueX,VueRouter的配置学习
最新发布
qq_58462591的博客
01-30 1353
在文件中写​​routes:[},},})​需要注意的是history:createWebHistory(),是路由的工作模式，还有种hash模式但是hash模式会让url带#，我们一般都采用history的模式，但是需要后端后面去处理404等问题。然后是更改main.js更改main.js如下​//引入路由器//创建应用//使用路由器再去App.vue里面引用<template><div>-- 导航 -->
Numpy模块常用方法汇总
m0_52839423的博客
12-30 949
Numpy 模块常用方法汇总 文章目录Numpy 模块常用方法汇总随机数数组基本随机数random.rand(d0, d1, ..., dn)random.random_sample(size)random.randint(low, high = None, size = None)random.random_integers(low, high = None, size = None)常用的分布随机数random.randn(d0, d1, ..., dn)random.normal(loc = 0.0,
python使用numpy的np.mod函数计算numpy数组除以某一特定数值剩余的余数（remainder）、np.mod函数和np.fmod函数对负值的处理方式有差异
data+scenario+science+insight
01-31 1536
python使用numpy的np.mod函数计算numpy数组除以某一特定数值剩余的余数（remainder）、np.mod函数和np.fmod函数对负值的处理方式有差异
numpy的下载与安装教程——（解决No module named numpy问题）
热门推荐
YBUIIPL的博客
03-08 8万+
NumPy函数库是Python开发环境的一个独立模块，而且大多数Python发行版没有默认安装NumPy数据库，因此在安装Python之后必须单独安装NumPy数据库。 进入Python shell开发环境后输入 from numpy import* 如果出现No module named numpy问题则需要安装numpy数据库。 1.下载NumPy数据库 下载地址：http://ww
numpy.mod详解
wzy628810的博客
01-07 1万+
numpy.mod 用例: numpy.mod(x1, x2, /, out=None, *, where=True, casting=‘same_kind’, order=‘K’, dtype=None, subok=True[, signature, extobj]) = <ufunc ‘remainder’> 功能: 计算两数组对应位置元素的余数。 当对数组执行地板除fl...
np.mod() 取模运算
qq_42251157的博客
09-23 441
np.mod()
Vue 2.0中使用Vue-html5-editor 编辑器的一些问题解决
越陌度阡
08-24 6242
近期由于需要对公司运营系统进行优化和升级，而原有后台系统所使用的vue-quill-editor编辑器对粘贴进来的内容的行内样式全部进行了过滤，虽然这样可以防止XSS攻击，但是却完全无法满足业务需要，为此对编辑器进行了更换，采用Vue-html5-editor 这个编辑器。 这是一个基于Vue 2.0系列的编辑器（官方地址），还不错，但却存在一些问题，以下记录这些问题，并提供解决办法。 1. 复制网络图片时无法粘贴成功。 主要原因是图片链接存在跨域问题。运营人员复制的内容都是基于微信环境的，微信对所有
vue中引入TinyMCE实现富文本编辑器
小球的博客
02-28 3425
vue tinymce 富文本编辑器
vue3 a-ange跨度一年
07-27
根据引用\[1\]中提到的情况，elm-ui的API中没有限制el-date-picker的最大跨度为一年。因此，如果你想要实现一个最大跨度为一年的日期选择器组件，封装一个自定义组件是很有必要的。你可以使用v-model来在自定义组件上进行双向绑定。 另外，根据引用\[2\]中提到的问题，如果你在vue3中使用vue-grid-layout时遇到了报错"external_commonjs_vue_commonjs2_vue_root_Vue_default.a is not a constructor"，解决方案是确保你下载并安装了vue-grid-layout的vue3版本，例如vue-grid-layout@3.0.0-beta1。因为vue-grid-layout是vue2版本的，所以在vue3中使用时需要安装对应的vue3依赖和相关配置，以确保兼容性。 综上所述，如果你想要实现一个vue3的a-ange跨度一年的功能，你可以封装一个自定义组件，并使用v-model进行双向绑定。同时，确保你安装了vue-grid-layout的vue3版本以避免报错。 #### 引用[.reference_title] - *1* [el-date-picker最大跨度一年组件封装](https://blog.csdn.net/weixin_43917792/article/details/116003776)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insert_down1,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* *3* [VUE3 中实现拖拽和缩放自定义看板 vue-grid-layout](https://blog.csdn.net/lovexiuwei/article/details/127916659)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insert_down1,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值