打包工具的选择
webpack 一切皆模块,支持模块打包及丰富的插件扩展功能。功能强大生态配套全,但是插件机制和内部逻辑晦涩难懂。 Rollup Rollup 在应用打包方面更加成熟和灵活。成熟稳定,但是不是开箱即用的。 vite 严格来说 vite 不算打包工具,因为它集成了 web 配套+server+生产构建等...打包只是它的其中一小块功能,但它的基于原生 ESM 实现理论最优性能的热更新和...
共 17 篇文章
webpack 一切皆模块,支持模块打包及丰富的插件扩展功能。功能强大生态配套全,但是插件机制和内部逻辑晦涩难懂。 Rollup Rollup 在应用打包方面更加成熟和灵活。成熟稳定,但是不是开箱即用的。 vite 严格来说 vite 不算打包工具,因为它集成了 web 配套+server+生产构建等...打包只是它的其中一小块功能,但它的基于原生 ESM 实现理论最优性能的热更新和...
工具类 下面,我们就打包一个简单的工具函数,对此 js 文件分别进行 webpack 和 rollup 的打包 js // index.js function adda, b { return a + b; } export { add }; 打包之前我们先配置一些 package.json json { "name": "tools", "version": "0.0.1"...
日常开发中我们都是使用别人开发的 npm 包,我们如何自己也发布一个 npm 包呢,本文将从零开始从搭建打包发布一一讲解。 一、初始化 npm 包 npm iniy y 二、开发一个简单的插件 js // index.js function adda, b { return a + b; } export { add }; 三、配置 package.json json { ...
技术 个人 今年签名
前端的打包工具 还记得以前用webpack3的时候,各种莫名其妙的插件,还特别难配置,不知道是不是我的学习姿势不对,后来我转用了parcel,那时候到现在我的项目打包都是用parcel,包括我的个人项目pencilvue也是用parcel打包的,当然会有些许缺点,后面再说。 parcel parcel的卖点就是零配置,相信被webpack折腾过的同学都会体会到parcek的好。当初只看了parc...
初始化npm项目 一般初始化一个项目,我们只需要执行npm init之后会要你输入一些项目信息,如果想跳过输入信息的过程你也可以执行npm init y 或者 npm init f npm script中的内置命令 在npm中的script中的内置命令可以简写去掉'run' 比如 npm run test可以简写为npm test也可以简写为npm t npm run start可以简写为...
我对前端工程化的理解(未写完) 最近在日常工作中我发现很多重复性的操作可以用工具或者写个脚本来搞定,比如以前构建一个项目是靠手动创建的,现在我们可以通过vue create helloworld 创建一个vue项目 npm init y 初始化一个包管理文件 parcel index.html 打包项目与浏览器热更新,使用ESlint校验js文件是否规范,使用Karma测试代码等等,如果把工作流程...
angular1.x 的使用总结 我从18年5月的时候去了一家主要使用angular的公司,当时angular这个框架给人的印象很高大上,”用angular的太牛逼了“的感觉,因为angular的学习成本很高,使用的是typescript和自带一些非常高端的概念,后来得知公司用的是angular1.x当时最新版本是6angular1.x和angular2以上的版本差别简直就是另一个框架,就像ja...
切换 node 版本的工具——nvm 需求 公司老项目需要用 node0.1 版本来维护,进行中的项目用 v8,但我又想尝试最新的 v10,我在想有没有切户 node 版本的工作呢? 解决 问了身边的人都是用新不用旧的,我在 google 上找了很多解决方法,用 python 或者用 C++写的一些软件来弄的,其中最流行的是一个 nvm 的包,原作者只用 shell 只写了一个 mac...
如何优雅的写事件委托 记得在一个技术面试的时候,面试官问我如果有无数个dom,如何给每个dom添加点击事件,点击获取当前dom的内容,并且要我在编辑器里面写出来,好家伙,我第一个就想到事件委托,下面列出常用的几个事件委托的写法 题目如下 点击li获取当前li的内容 html <ul <li1</li <li2</li <li3</li ... </ul Element.c...
聊聊 2018 年我所不了解的技术(转载) 前言 本来是个人博客不应该出现转载文章的,但是今天看到这个Redux作者Dan Abramov的这篇博客让我延伸了不少思考,我看的时候是英文版,现在被翻译成9种语言了。博客原文https://overreacted.io/zhhans/thingsidontknowasof2018/ 原文 大家总以为我懂得许多技术,但实际情况并非如此。我不是...
技术 今年在githu上参与了一些开源项目,发现开发中“读代码”和“改代码”能力很重要。 个人 (审美)今年进入了一个新的工作环境,新的项目组,在没有设计图的情况下开发,发现自己的审美并没有那么好,下班回家途上思考片刻,程序员做开发同时是否需要提升审美呢,我的结论是:“每个公司的开发流程不一样,每个人的工作风格不一样,如果在我不能要求其他人的情况下,只能提升自己的能力” (人机交互体验)...
技术 今年是写业务代码的一年,对个人业余学习的时间越来越少了,但也学会了应对各种需求和业务。 明年努力学习,给自己的title是独立开发者。 个人 回顾今年似乎什么都没做,又似乎做了很多。 今年依然是一个疫情年呢。 焦虑过,自大过,也自卑过。 今年签名 导演,我要跟你谈谈人生
技术 今年真是完完全全用vue做了一年的项目,vue确实比angularjs好用很多。真香!! vue2使用defineProperty做出来的响应式设计导致引用类型‘数据刷新视图不刷新’的问题,在vue3得到了改进。 在我还没完全使用react之前,我认为vue还是最好的框架,非常期待vue3 今年flutter突然就火了,github上的Issuse还是一大堆. 伪类选择器其实很好...
名词约定 Dashboard 控制台/控制面板 admin 管理 permssim 权限 接口(前后端之间的接口,一般指url) 单页/多页 单页:用router接管所有页面的路径,访问的都是同一个页面。无SEO 多页:每个页面都是不同的html文件,访问的都是不同页面。利于SEO RESTful API——URL起名字方法论 登录 登出 注册 购买 权限设置 ...
闭包概念 简单解释 闭包就是一个访问父函数局部变量的函数
学习方向 前端的技术每年都发生变化,最近听到有同学说“学不动了”,其实我觉得当你学习到一个深度的时候会发现很多技术都是相通的,这就是我们说的“万法归一”,看完下面技术归类后再也不用担心前端学习哪个框架,到底用sass还是less,后端用什么语音了。。。 关于「如何取舍一些技术」: 无论使用的是什么技术,往上走必然会走到一个更高的抽象层面,这个时候所有「变化的表象」就 merge 成了「根不变的基...