![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端构建
7哥-web
这个作者很懒,什么都没留下…
展开
-
git rebase 和 git push --force-with-lease的使用
git rebase合并代码和回退Git rebase的使用合并代码代码回退Git rebase的使用Git rebase合并代码,可以使git的提交树,更加清晰美观。还可以用git rebase合并代码合并代码使用git rebase合并分支(commit),会基于要合并的分支,生成新的commit。git rebase develop git push --force-with-lease代码回退git rebase -i 8dii93dx8sex0d03ld8sje命令行会显示原创 2021-09-29 19:58:23 · 1176 阅读 · 0 评论 -
webpack构建优化
压缩去重分块单页应用多页应用原创 2016-11-14 18:51:43 · 972 阅读 · 0 评论 -
编写一个webpack插件
插件将Webpack引擎的全部潜能暴露给第三方开发人员。使用分段构建回调,开发人员可以将自己的行为引入Webpack构建过程。插件的开发比起加载器(loaders)的开发更近了一步,因为你需要用一些webpack底层的内部构建来钩住他们。准备去阅读一下webpack的源码吧。compiler和compilation在开发插件时,两个最重要的对象是:compiler和compilation。了解他们的原创 2016-12-10 20:46:01 · 2796 阅读 · 0 评论 -
webpack工作流程分析
目前,几乎所有业务的开发构建都会用到 webpack 。的确,作为模块加载和打包神器,只需配置几个文件,加载各种 loader 就可以享受无痛流程化开发。但对于 webpack 这样一个复杂度较高的插件集合,它的整体流程及思想对我们来说还是很透明的。那么接下来我会带你了解 webpack 这样一个构建黑盒,首先来谈谈它的流程。准备工作1. webstorm 中配置 webpack-webstorm-原创 2016-11-15 18:20:49 · 3155 阅读 · 0 评论 -
webpack的code spliting与chunks
为什么要使用代码分割code spliting?对于一个大型项目而言,将所有代码打包进一个文件可能会导致打包后的文件非常大(虽然减少了请求次数,单个文件过大会导致阻塞),而且有些代码只是在某些情况下是必需的,这就导致了效率低下。webpack有一个code spliting的特性,它可以将你的代码库分割成按需加载的块(chunks)。怎么定义了一个分割点split pointAMD和commonJS原创 2016-11-03 14:06:43 · 2441 阅读 · 2 评论 -
webpack开发工具webpack-dev-server使用指南
使用初步安装webpack-dev-server: 在项目目录下执行,npm install webpack-dev-server -g 运行 webpack-dev-server 自动刷新有两种模式自动刷新页面: * Iframe mode (网页是内嵌在一个iframe中的) * Inline mode (将一个小的webpack-dev-server客户端条目添原创 2016-10-11 17:23:35 · 1743 阅读 · 0 评论 -
webpack样式处理
样式嵌入通过使用style-loader和css-loader,webpack可以将样式文件打包进一个js包中(javascript bundle),你可以对你的样式进行模块化,就像require(‘./stylesheets.css’);安装npm install style-loader css-loader --save-dev配置以下这个示例能使用require()css: { /原创 2016-11-14 13:04:53 · 1153 阅读 · 0 评论 -
webpack要点
webpack是一个模块打包工具(module bundle)loaders非JS资源转换pluginswebpack功能扩展原创 2016-09-20 13:20:09 · 324 阅读 · 0 评论 -
gulp学习总结
入门指南1.全局安装 gulp: $ npm install --global gulp2.在项目中安装gulp: $ npm install --save-dev gulp3.准备gulpfile.js文件:var gulp = require('gulp');gulp.task('default', function() { // 将你的默认的任务代码放在这});4.运行gulp:$ gu原创 2016-08-30 16:34:57 · 264 阅读 · 0 评论 -
Grunt API思维导图
只作为草图,以后再做详细。原创 2016-04-29 15:25:02 · 516 阅读 · 0 评论 -
Grunt使用初步
Grunt知识点1.Grunt Cli要在命令行中使用grunt,必须先将grunt-cli先安装到全局环境中: npm install -g grunt-cli (要使用npm,请先安装node,如未安装,请自行安装)grunt-cli工作原理*每次运行grunt 时,他就利用node提供的require()系统查找本地安装的 Grunt。正是由于这一机制,你可以在项目的任意子目录中运行gr原创 2016-04-24 16:56:31 · 709 阅读 · 0 评论