大事件项目64----打包发布_cdn地址引入,免费cdn的网站

简介: 大事件项目64----打包发布_cdn地址引入,免费cdn的网站

1、一般CND的流量是要花钱的

2、unpkg.com这个是免费的cdn的网站

3、这个怎么用呢?在这个un后面写你的包名

4、不用写冒号,直接写包名,直接写版本

5、我们看一下vue的版本

6、这个包名,要换成vue

7、这个版本,换成你的版本

8、输入上面的内容,我们直接回车就行

9、这个链接就是vue的源代码

10、这个链接我们就放到自己的html里

11、vue-router的写法

12、你想看一下这个、工程都有什么,你就写一个/,就可以看到这个网页了

13、这个网页都可以看到引入的文件

14、在这里你可以看到引入的文件

15、这个时候,前面多了一个browse叫浏览

16、把这个浏览给去掉

17、这些cdn的地址大家已经提前准备好了是、

18、这个就是cdn的地址

19、不要放到dist里,放到dist里,会将其覆盖,要将他放到index里

20、js我们放到body末尾

21、还有样式呢?引入element 和富文本编辑器的cdn的样式

22、 样式就在 head里 ,格式化对齐

23、全选,vscode 格式化对齐

24、vscode 格式化代码

25、在main.js中注释掉element-ui的样式

26、右键运行,这里能够运行吗?

27、所以记住改了public,改了src,就要重新,build打包,否则会在打包的时候,覆盖掉

28、打包之后,我们可以看到能够正常显示

29、git add 提交打包发布的代码


相关实践学习
Serverless极速搭建Hexo博客
本场景介绍如何使用阿里云函数计算服务命令行工具快速搭建一个Hexo博客。
相关文章
|
2月前
|
缓存 前端开发 JavaScript
阿里云CDN:怎么让网站变快
阿里云CDN:怎么让网站变快
|
2月前
|
缓存 前端开发 JavaScript
前端架构思考:代码复用带来的隐形耦合,可能让大模型造轮子是更好的选择-从 CDN 依赖包被删导致个站打不开到数年前因11 行代码导致上千项目崩溃谈谈npm黑洞 - 统计下你的项目有多少个依赖吧!
最近,我的个人网站因免费CDN上的Vue.js包路径变更导致无法访问,引发了我对前端依赖管理的深刻反思。文章探讨了NPM依赖陷阱、开源库所有权与维护压力、NPM生态问题,并提出减少不必要的依赖、重视模块设计等建议,以提升前端项目的稳定性和可控性。通过“left_pad”事件及个人经历,强调了依赖管理的重要性和让大模型代替人造轮子的潜在收益
|
2月前
|
存储 JavaScript 安全
vue项目打包优化:缩小体积productionSourceMap设置,使用cdn加速
vue项目打包优化:缩小体积productionSourceMap设置,使用cdn加速
210 0
|
2月前
|
网络协议 CDN
阿里云国际版CDN加速,如何判断网站IP已加速?
阿里云国际版CDN加速,如何判断网站IP已加速?
|
2月前
|
存储 网络协议 安全
阿里云国际CDN加速图文和视频类网站操作教程
阿里云国际CDN加速图文和视频类网站操作教程
|
2月前
|
缓存 网络安全 数据安全/隐私保护
使用阿里云国际CDN加速后网站无法访问的排查步骤
使用阿里云国际CDN加速后网站无法访问的排查步骤
|
5月前
|
缓存 监控 前端开发
利用CDN提升网站性能的技术探索
【7月更文挑战第8天】CDN作为提升网站性能的重要工具,已经广泛应用于各类网站中。通过减少延迟、加速静态资源加载、提高网站可用性和优化带宽成本等方面,CDN为网站运营者提供了全面的性能优化方案。然而,要充分利用CDN的优势,还需要合理选择CDN提供商、正确配置CDN服务以及持续优化网站内容。只有这样,才能真正实现网站性能的提升和用户体验的优化。
|
6月前
|
前端开发 JavaScript CDN
大事件项目63----cdn介绍
大事件项目63----cdn介绍
|
3天前
|
对象存储 CDN
阿里云CDN边缘脚本实现+字符转义%2B
对象存储OSS中,文件名包含+字符时,请求URL未转义会导致404错误。解决方法是将URL中的+字符转义为%2B,或通过CDN/DCDN边缘脚本自动转义。示例脚本:若URI包含+,则替换为%2B。
39 10
|
13天前
|
网络协议 网络安全 Docker
将Certbot/ACME.sh自动化申请的证书自动部署到阿里云CDN
本文介绍了阿里云 CDN SSL 证书自动更新工具,定期检查证书有效期,使用Let's Encrypt 等工具签发的证书自动更新至阿里云 CDN,支持 Docker 及 .NET 8 部署,简化证书管理流程。
下一篇
DataWorks