构建工具

Vue 首屏加载优化

关于 Vue 首屏加载优化的一点总结

为何咱们要作三份 Webpack 配置文件

在知乎上咱们经常会看到有同窗发问：BAT 等大型网站的前端工程是如何组织管理的？这的确是一个能够发散的很广的 Q&A，我想若是要我回答这个问题，不如先从 Webpack 配置提及。时至今日，Webpack 已经成为前端工程必备的基础工具之一，不只被普遍用于前端工…

再见，babel-preset-2015

Babel 的官网上在9月宣布 ES2015 / ES2016/ ES2017 等等 ES20xx 时代的 presets 统统被废弃（deprecated），取而代之的是 babel-preset-env，而且承诺它将成为“将来不会过期的（future-proof）”解决方案。

[[vscode] 快速更新 package.json 里的依赖版本](https://juejin.im/entry/593e5...

帮助 node 依赖保绿强迫症患者缓解症状的良药

手把手教你从零写一个简单的 VUE

今天给你们带来的是实现一个简单的相似 VUE 同样的前端框架，VUE 框架如今应该算是很是主流的前端数据驱动框架，今天咱们来从零开始写一个很是简单的 VUE 框架，主要是让你们知道最核心的 vue 部分是怎么运转起来的。包括数据绑定，模板处理，以及页面渲染，数据驱动视图等几个部分

快速打造简易高效的webpack配置

webpack给前端开发带来了毋庸置疑的改变，它把JS，图片，css都做为模块处理，同时具备开发便捷，自动化，兼容AMD写法等等诸多无须赘述的优势，更使人称道的是其插件社区很是强大，对于不一样的业务需求和技术需求社区都有大量插件可供使用。 凡事都具备两面性，许多人说：前端开发不再…

npm 入门教程

Node.js 的出现使得用 写服务端应用成为可能。Node.js 由 C++ 编写而成而且构建于V8 引擎之上，所以运行得很快。一开始，Node.js 只是想运行于服务端环境，可是开发者们显然不知足于此，开始创造各类工具来实现自动化任务。也由于此，基于 Node 的前端自动化工具（如Grunt, Gulp 和 Webpack)的出现也给前端开发带来了翻天覆地的变化。

本文最后更新时间为 08.06.2017, 介绍了包括了 npm 当前现状，以及 npm5 的一些改变。

Jenkins实现前端项目自动化集成打包部署

之前写前端项目打包部署，都是手动运行命令，打包完，而后压缩，再上传到服务器解压。
这种方式确实有点low而且效率也不高。
自从用了Jenkins持续集成工具，写前端项目愈来愈工程化，不再用担忧忘记部署项目，也不用烦躁每次打包压缩后还要部署多个服务器和环境，更开心的是每次家…

webpack-dev-server 中 inline 和 HMR 的区别

webpack-dev-server webpack-dev-server 是一个小型的 node.js Express 服务器, 它使用 webpack-dev-middleware 中间件来为经过 webpack 打包生成的资源文件提供 Web 服务。它还有一个经过 Socket.IO 链接着 we…

Webpack中的静态资源文件指纹

本文讲解了在webpack中如何给静态资源加hash值：每次构建过程都会生成一个新的hash，因此通常用于作版本控制；chunkhash是基于内容生成的，可是webpack把全部类型的文件都以js为汇聚点打成一个bundle，改了css也会致使整个js的hash发生改变...

前端图片预览

不少时候咱们都会有图片上传的功能需求，若是咱们先将图片上传到服务器，而后在将返回结果显示在前端，这样的操做性能开销太大，若是图片一多，简直要哭，并且万一还碰到了上传错误要删除的，那简直没法想象了。因此咱们须要先将图片在前端展现后，而后由用户确认没有问题了，再统一上传，这样才是比…

基于 Vue 配置 axios

看完就会用的 GIT 操做图解分析

不管你是前端仍是后台，不管是运维仍是移动端研发，GIT 是逃避不了的东西，固然你说你要用 SVN，那不在此次的讨论范围以内。很少说，请看下文 GIT 图解分析，10 分钟学会 git 操做，固然下面的教程是为实战为主，会跟你在别的网站看到的不同。

webpack入门必知必会

关于 微信公众号：前端呼啦圈（Love-FED） 个人博客：劳卜的博客 知乎专栏：前端呼啦圈 前言 这是我第一篇介绍webpack的文章，先从一个入门教程开始吧，后续会有更多相关webpack的文章推出。 首先什么是webpack？若是说它是一个打包工具那真的是有点大材小用了。…

分享 GitHub 上 有趣、入门级的开源项目

之前全部的内容都是托管在 GitHub 上，如今用 Flask 写了这个网站。查看、推荐项目、编辑、分发终于能够程序化了 ?

webpack中hash和chunkhash是否是很眼熟？

后者很容易理解，由于chunk在webpack中的含义就是模块，那么chunkhash根据定义来就是模块内容计算出来的hash值。 这里咱们还得提一个问题，好比像vue这些框架，把js和css共同放在一个里面会时，咱们通常会用一个插件叫extract-text-webpack-…

vue-cli中的webpack配置

编辑模式下显示正常，打开的时候不知道为啥排版有问题。segementfalut连接在这里 版本号 vue-cli 2.8.1 (终端经过vue -V 可查看) vue 2.2.2 webpack 2.2.1 目录结构 ├── README.md ├── build │ ├── …

webpack 插件拾趣 (1) —— webpack-dev-server

你或许会花上 30 分钟的时间读完本章，并掌握 webpack-dev-server 的使用方法、理清一些容易困惑的配置（如 publicPath）或概念（如 HMR）...

知多一点 webpack 的 CommonsChunkPlugin

hello~亲爱的看官老爷们你们好~ 最近一直在学习 webpack 的相关知识。曾几什么时候我总以为 webpack 的体系庞大而难以掌握，一直回避不肯去学。然而伟人鲁迅曾说过： 世上太多事会因没法掌握而使你狂躁不安，最好的解决方法就是硬着头皮开始作！ 于是就从比较简单的 Com…

VueJS 开发常见问题集锦

因为公司的前端开始转向 VueJS，最近开始使用这个框架进行开发，遇到一些问题记录下来，以备后用。
主要写一些 官方手册 上没有写，可是实际开发中会遇到的问题，须要必定知识基础。
CLI: Vue-CLI UI: Element HTML: Pug(Jade) CSS: Les…

vue-cli 自定义路径别名 assets和static文件夹的区别 --save-dev和--save的区别

这是一篇vue-cli的几个小知识点简单介绍，适用于刚接触vue-cli脚手架以及对此方面并不太了解的同窗，大佬们绕道。有须要的朋友能够作一下参考，喜欢的能够点波赞，或者关注一下，但愿能够帮到你们。 相信有不少人知道vue-cli有两个放置静态资源的地方，分别是src/asse…

webpack：从入门到真实项目配置

自从出现模块化之后，你们能够将本来一坨代码分离到个个模块中，可是由此引起了一个问题。每一个 JS 文件都须要从服务器去拿，由此会致使加载速度变慢。Webpack 最主要的目的就是为了解决这个问题，将全部小文件打包成一个或多个大文件，官网的图片很好的诠释了这个事情，除此以外，Web…

webpack 从入门到工程实践

本文的初衷是和你一块儿理清webpack的使用逻辑，以便能更加容易的编写及拓展本身项目所需的配置文件。不过也得提早说明本文可能并非一篇好的能够跟着操做的教程（想跟着一步步作的童鞋能够看官方示例（https://webpack.js.org/guides/）和 webpack 入门，看这篇就够了（http://www.jianshu.com/p/42e1...）。

你要看看这些有趣的函数方法吗？

前言 这是 underscore.js 源码分析的第六篇，若是你对这个系列感兴趣，欢迎点击 underscore-analysis/ watch 一下，随时能够看到动态更新。 下划线中有很是多颇有趣的方法，能够用比较巧妙的方式解决咱们平常生活中遇到的问题，好比_.after,_.be…

webpack-dev-middleware详解

webpack专题

读前端中文文档，来印记中文就对了，最权威的中文开发文档

Vue/React/Webpack/PostCSS...咱们还在不断地整合社区资源，同官方开展合做，为中文社区开发者们提供最新最可靠的中文开发文档，也欢迎有能力的同窗加入咱们一块儿翻译校对文档。

Node 命令行翻译工具

Node 翻译工具，友好地帮助解决开发中遇到的英文报错问题。

记一次webpack打包优化

改造基于vue-cli的打包优化