ChampYin's Blog

自律是真正的自由


  • Home

  • Tags

  • Archives

  • About

  • Categories

  • Search

nginx安装(linux环境)

Posted on 2020-02-21 | In 服务器 | Visitors:
Words : 462 | Reading ≈ 2 min

nginx-install-cover.png

Nginx 是一款高性能的 Web 和 反向代理 服务器,也是一个 IMAP/POP3/SMTP 代理服务器。它的开发者是俄罗斯工程师:Igor Sysoev。
这篇是针对 Linux 操作系统的安装。

Read more »

揭秘webpack loader

Posted on 2020-01-28 | In 前端技术 | Visitors:
Words : 2.7k | Reading ≈ 11 min

webpack-loader-cover.png

Loader(加载器) 是 webpack 的核心之一。它用于将不同类型的文件转换为 webpack 可识别的模块。本文将尝试深入探索 webpack 中的 loader,揭秘它的工作原理,以及如何开发一个 loader。

Read more »

《新型冠状病毒肺炎预防手册》电子书

Posted on 2020-01-27 | In 电子书 | Visitors:
Words : 482 | Reading ≈ 1 min

new-coronavirus-cover.png

没想到这次爆发的肺炎疫情这么严重。 这个是从湘雅医学院老师那获取的 新型冠状病毒肺炎预防手册 普及扩散之。

Read more »

揭秘webpack plugin

Posted on 2020-01-12 | In 前端技术 | Visitors:
Words : 2.7k | Reading ≈ 10 min

webpack-plugin-cover.png

Plugin(插件) 是 webpack 生态的的一个关键部分。它为社区提供了一种强大的方法来扩展 webpack 和开发 webpack 的编译过程。本文将尝试探索 webpack plugin,揭秘它的工作原理,以及如何开发一个 plugin。

Read more »

webpack配置本地loader的四种方法

Posted on 2020-01-04 | In 前端技术 | Visitors:
Words : 407 | Reading ≈ 1 min

通常我们配置 loader 只需直接使用 loader 的名字,不用关心 loader 的路径。那是因为通过 npm 或者 yarn 安装的 loader 都会安装在 node_modules 目录下,而 webpack 默认所有第三方模块都会去 node_modules 里找。

当我们要使用本地 loader (例如测试自己开发的loader),而这些模块不在 node_modules 里的时候,就需要告诉 webpack 存放 loader 的位置。

Read more »

封装axios

Posted on 2019-12-23 | In 前端技术 | Visitors:
Words : 3k | Reading ≈ 12 min

wrap-axios-cover.png

axios 是一个轻量的 HTTP客户端,它基于 XMLHttpRequest 服务来执行 HTTP 请求,支持丰富的配置,支持 Promise,支持浏览器端和 Node.js 端。自Vue2.0起,尤大大(Vue作者尤雨溪)宣布取消对 vue-resource 的官方推荐,转而推荐 axios。现在 axios 已经成为大部分 Vue 开发者的首选。( 如果你还不熟悉 axios,可以在这里查看它的API。)

axios 的API很友好,你完全可以很轻松地在项目中直接使用。不过随着项目规模增大,如果每发起一次HTTP请求,就要把这些比如设置超时时间、设置请求头、根据项目环境判断使用哪个请求地址、错误处理等等操作,都就地写一遍,得疯!这种重复劳动不仅浪费时间,而且让代码变得冗余不堪,难以维护。

为了提高我们的代码质量,我们应该在项目中二次封装一下 axios 再使用。

Read more »

Ajax vs Axios vs Fetch

Posted on 2019-12-20 | In 前端技术 | Visitors:
Words : 812 | Reading ≈ 3 min

发HTTP请求是JS前端应用最常见的任务之一。实现HTTP请求有非常多解决方案,目前主流的几个解决方案有 ajax、axios 和 fetch。哪个好?如何选?下面对这几个方案进行一个简单的对比分析。

Read more »

webpack中的publicPath

Posted on 2019-12-05 | In 前端技术 | Visitors:
Words : 1.3k | Reading ≈ 5 min

webpack的常用基本配置我们可能已经耳熟能详,比如 input,output,module,plugins,devServer的配置等等。而在这些基本配置中,其实还有一些细节参数,它可以帮助我们更好的定制化打包的目录结构,但它可能并不是那么好理解,比如publicPath。

Read more »

webpack优化之happypack

Posted on 2019-11-29 | In 前端技术 | Visitors:
Words : 532 | Reading ≈ 2 min

上篇文章webpack优化之玩转代码分割和公共代码提取从代码维度出发,为生产环节进行了优化(通过提取公用代码减小打包结果体积,提升线上体验)。而在开发大型前端项目时,经过一段时间的开发维护和不断迭代,随着业务功能增多,就算提取了公共代码,项目体积仍会越来越大(如果不从产品层面优化,这是无法避免的),这意味着编译打包时间会越来越久、从修改代码到看到效果的等待时间越来越长。为了更好的开发体验,这次我们来为开发环节做一些事情。

Read more »

webpack优化之玩转代码分割和公共代码提取

Posted on 2019-11-15 | In 前端技术 | Visitors:
Words : 3.5k | Reading ≈ 13 min

webpack-optimize-cover2.png

开发多页应用的时候,如果不对webpack打包进行优化,当某个模块被多个入口模块引用时,它就会被打包多次(在最终打包出来的某几个文件里,它们都会有一份相同的代码)。当项目业务越来越复杂,打包出来的代码会非常冗余,文件体积会非常庞大。大体积文件会增加编译时间,影响开发效率;如果直接上线,还会拉长请求和加载时长,影响网站体验。作为一个追求极致体验的攻城狮,是不能忍的。所以在多页应用中优化打包尤为必要。那么如何优化webpack打包呢?

Read more »
1234…11
ChampYin

ChampYin

Life doesn't get easier, you just get stronger.

108 posts
20 categories
109 tags
© 2024 ChampYin | 95k
Powered by Hexo
| UV | PV
浙ICP备2020044347号-1