虽然现在网络环境和电子设备变得越来越好，但是保持应用程序快速加载变得越来越困难。在本系列中，我将深入研究我们在实践中使用的Vue性能优化技术，并且您可以在Vue.js应用程序中使用它们，使应用程序快速加载并顺利执行。我的目标是让这个系列成为关于Vue应用程序性能的全面而完整的指南。
由于公司的前端开始转向 VueJS，最近开始使用这个框架进行开发，遇到一些问题记录下来，以备后用。
横空出世的Parcel，这几个月来成为了前端圈的又一大热点，github短短几个月就获得了上万的star.
在过去的一年里，出现了一批新的开发工具，它们正在紧跟过去几年主导前端开发的工具，包括 webpack、 Babel、 Rollup、 Parcel、 create-react-app。
webpack 是代码编译工具，webpack 是一个用于现代 JavaScript 应用程序的静态模块打包工具，俗称: 打包工具
两年前，我写了一篇有关module/nomodule技术的文章（译者注：原文地址https://philipwalton.com/articles/deploying-es2015-code-in-production-today/，文末有此文的译文链接），这项技术允许你在编写ES2015+代码时，使用打包器和转换器生成两个版本的代码库，一个具有现代语法的版本（通过 <scripttype="module">加载）和一个使用ES5语法的版本（通过 <scriptnomodule>加载）。该技术允许你向支持模块（译者注：指ECMA制定的标准的export/import模块语法及其加载机制，又称为ES Module、ESM、ES6 Module、ES2015 Module，下文中将出现很多"模块"一词，都是这个含义）的浏览器发送更少的代码，现在大多数Web框架和CLI都支持它。
Getting Started | BootstrapVueGet started with BootstrapVue, based on the world’s most popular framework – Bootstrap v4, for building responsive, mobile-first sites using Vue.js
webpack打包原理 1、把一切都视为模块：不管是 CSS、JS、Image 还是 HTML 都可以互相引用，通过定义 entry.js，对所有依赖的文件进行跟踪，将各个模块通过 loader 和 plugins 处理，然后打包在一起。 2、按需加载：打包过程中 Webpack 通过 Code Splitting 功能将文件分为多个 chunks，还可以将重复的部分单独提取出来作为 commonChunk，从而实现按需加载。把所有依赖打包成一个 bundle.js 文件，通过代码分割成单元片段并按需加载 3、webpack.config.js的配置
今天给大家分享一篇 JS 库打包的参考指南，如果你也在维护一些 JS 库，可以参考一下～
大家好，我是 ConardLi。今天给大家分享一篇 JS 库打包的参考指南，如果你也在维护一些 JS 库，可以参考一下～
React是FaceBook（脸书）公司研发的一款JS框架（MVC） React是一款框架：具备自己开发的独立思想(MVC：Model View Controller) -> 划分组件开发 -> 基于路由的SPA单页面开发 -> 基于ES6来编写代码(最后部署上线的时候，我们需要把ES6编译成ES5 =>基于Babel来完成编译) -> 可能用到Less/Sass等，我们也需要使用对应的插件把他们进行预编译 -> 最后为了优化性能（减少HTTP请求次数），我们需要把JS或者CSS进行合并压缩 -> webpack来完成以上页面组件合并、JS/CSS编译加合并等工作
相信很多人在学习前端过程中，都接触过webpack。但可能在创建前端项目时，都只是用脚手架vue-cli的初始化命令跑一下，将webpack当成一个黑盒使用，刚开始我也是这样，但是虽然一切配置都能通过脚手架自动完成，我们不用学会如何手动去配置，但是我们也至少应该知道，webpack每条配置的作用。
Webpack是一个模块打包工具，在Webpack里一切文件皆模块。通过loader转换文件，通过plugin注入钩子，最后输出由多个模块组合的文件。Webpack专注构建模块化项目。 Webpack可以看作是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其他一些不能被浏览器直接运行的扩展语音(如：Scss,TypeScript等)，并将其打包为合适的格式以供浏览器使用。
思考这样一个问题，你对webapack究竟了解多少？大部分时间我们忙于业务开发，很少去思考这个问题，项目已经配置好了，我们只管开发就好了，陷入业务开发中，就没有时间去思考别的问题，这是一个普遍现象。
大家好，我是小菜。一个希望能够成为 吹着牛X谈架构 的男人！如果你也想成为我想成为的人，不然点个关注做个伴，让小菜不再孤单！
今天继续我们的Webpack 4入门教程。在介绍了Webpack的基本概念之后，是时候更深入一点了。这次我们会涉及Webpack中非常强大的一个东西:loader。首先，我们会学习如何使用那些可用的loader。它将包括如何处理css、scss、图片以及对老版本的JavaScript语言的转换。让我们开始吧！
翻译：疯狂的技术宅原文作者：sokra原文链接：https://github.com/webpack/webpack/releases/tag/v4.0.0 重大更新 环境 不再支持Node.js 4
webpack是前端模块化打包工具，它把一切都看成模块，比如css、js、图片文件等都可以看成模块，再通过一些loader（加载器）和plugin（插件）对资源进行处理，打包成符合生产环境的前端资源。
大家好，今天我来和大家一起来了解前端模块化工具webpack的知识，如有疑问和错误，欢迎指正，一起交流探讨哈！
在网页开发的早期，js制作作为一种脚本语言，做一些简单的表单验证或动画实现等，那个时候代码还是很少的。那个时候的代码是怎么写的呢？直接将代码写在<script>标签中即可。随着ajax异步请求的出现，慢慢形成了前后端的分离，客户端需要完成的事情越来越多，代码量也是与日俱增。为了应对代码量的剧增，我们通常会将代码组织在多个js文件中，进行维护。但是这种维护方式，依然不能避免一些灾难性的问题。比如全局变量同名问题，看下面的例子：
最近开源了一个 Vue 组件，还不够完善，欢迎大家来一起完善它，也希望大家能给个 star 支持一下，谢谢各位了。
公司是东南亚(SEA)领先的运输平台，我们的使命是利用公司最新的技术和人才，推动SEA前进。截至2017年5月，我们每天处理230万次乘车，我们正在快速增长和招聘。
前几天听一个朋友说到 snowpack, 便去去看了下这个包是干什么的，看了下官网，发现这个东西还是蛮有意思的。号称 无需打包工具（Webpack，Parcel）便能将代码结果实时展现在浏览器中。可以先看以下的图，是不是很诱人？
大家好，我是 winty。今天给大家分享一篇 JS 库打包的参考指南，如果你也在维护一些 JS 库，可以参考一下～
本指南旨在提供一些大多数库都应该遵循的一目了然的建议。以及一些额外的信息，用来帮助你了解这些建议被提出的原因，或帮助你判断是否不需要遵循某些建议。这个指南仅适用于 库（libraries），不适用于应用（app）。
前言： 作为一个现代javascript 应用程序的静态模块打包器，webpack能将各种资源，如js，css， 图片等作为模块来处理，是当下前端工程化的一个很受欢迎的工具，webpack目前最新的版本是4.0，文章将在4.0 的基础上，从使用者的角度，一步步教你认识并搭建一个简单的webpack配置项目，当然webpack的配置和使用较为丰富且复杂。
本文译自：https://css-tricks.com/comparing-the-new-generation-of-build-tools/
安装依赖包 (-D 将依赖记录成开发依赖, 只是开发中需要用的依赖, 实际上线不需要的)
推荐使用ES6模块化，因为AMD，CMD局限使用与浏览器端，而CommonJS在服务器端使用。 ES6模块化是浏览器端和服务器端通用的规范.
WebPack可以看做是模块打包机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其转换和打包为合适的格式供浏览器使用。
Webpack 是一个前端资源的打包工具，它可以将js、image、css等资源当成一个模块进行打包。
例如，在开发阶段，imgUrl将是/img.png，而在生产版本中，它将变成/assets/img.2d8efhg.png。
周日在家看 web.dev 的 2020 三天 live，发现不少有意思的东西，其中有一项是关于 building tool 的，也就是我们常说的前端构建工具，当天的主播是 Jake Archibald（chrome team 成员，个人非常喜欢的技术专家）。
HI，继 Vue 3 和 React 17 之后，我又来啦！印记中文已经完成了 webpack v5 中文文档的同步及翻译工作，大家可以无缝进行阅读哦。 文档地址请认准：https://webpack.docschina.org 文档地址请认准：https://webpack.docschina.org 文档地址请认准：https://webpack.docschina.org 重要的事说三遍，我们的文档隶属于官方，我们没有其他的域名哦，并且是与官方进行实时同步。 2020 年 10 月 10 日，web
在项目根目录下新建 webpack.config.js，作为 webpack 的默认配置文件。
使用axios需要依赖axio.min.js.如果找不到资源可以参考https://blog.csdn.net/weixin_43274097/article/details/106570717。
webpack使用总结： 入门使用： 这个报错说明需要安装相应的Loader,并在引用时指定相应的loader 执行成功如图： chunk指相应的区块。 要是css引入正确：必须引入css-loade
你好！今天我们会开始一个 Webpack 4的入门教程。我们会以Webpack的基本概念开始，随着教程逐渐深入。这一次，我们将学习用ES6 modules进行模块化的基础知识。Webpack 4提供了默认配置，我们会逐步学习。让我们开始吧！
随着前端发展如日冲天，前端项目也越来越复杂，得益于Nodejs的发展，前端模块化、组件化、工程化也大势所趋。伴随着前端的模块化和工程化，Grunt、Gulp到Webpack等项目构建和打包工具也随之出现。
作为面试官，我经常听到很多候选人说在公司做的项目很简单，平常就是堆页面，写管理端，写H5,没有任何亮点，我以我一次面试候选人的经历分享给大家
本文主要介绍了uni-app的基本情况，并引导快速创建和运行第一个uni-app项目，同时对项目的目录结构和代码规范进行详细说明，适合uni-app零基础初学者。
对于入门选手来讲，webpack 配置项很多很重，如何快速配置一个可用于线上环境的 webpack 就是一件值得思考的事情。其实熟悉 webpack 之后会发现很简单，基础的配置可以分为以下几个方面： entry 、 output 、 mode 、 resolve 、 module 、 optimization 、 plugin 、 source map 、 performance 等，本文就来重点分析下这些部分。
现今的很多网页其实可以看做是功能丰富的应用，它们拥有着复杂的JavaScript代码和一大堆依赖包。为了简化开发的复杂度，前端社区涌现出了很多好的实践方法
快速、可靠、安全的依赖管理工具。和 npm 类似, 都是包管理工具, 可以用于下载包, 就是比npm快
2017年8月13日更新，本文依旧最新的webpack3.5.3将代码部分完全重写，所有代码都在Mac上正常运行过。希望依旧对你学习webpack有帮助。 写在前面的话 阅读本文之前，先看下面这个webpack的配置文件，如果每一项你都懂，那本文能带给你的收获也许就比较有限，你可以快速浏览或直接跳过；如果你和十天前的我一样，对很多选项存在着疑惑，那花一段时间慢慢阅读本文，你的疑惑一定一个一个都会消失；如果你以前没怎么接触过Webpack，而你又你对webpack感兴趣，那么动手跟着本文中那个贯穿始终
作者：吴浩麟 https://www.ibm.com/developerworks/cn/web/wa-lo-expedite-webpack/index.html Web 应用日益复杂，相关开发技术也百花齐放，这对前端构建工具提出了更高的要求。 Webpack 从众多构建工具中脱颖而出成为目前最流行的构建工具，几乎成为目前前端开发里的必备工具之一。 大多数人在使用 Webpack 的过程中都会遇到构建速度慢的问题，在项目大时显得尤为突出，这极大的影响了我们的开发体验，降低了我们的开发效率。 本文将传授你一
转载请注明出处：葡萄城官网，葡萄城为开发者提供专业的开发工具、解决方案和服务，赋能开发者。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
