01-什么是webpack的简单介绍?

简介: 01-什么是webpack的简单介绍?

.sass后缀的文件名  比较老了  现在它的后缀名是.scss  其实他们是同一个东西  只是 后缀名发生了变化


以 .sass写的文件的内容是  他没有括号  没有分号  有点怪  它跟新为了.scss  就有了花括号 和 逗号了


       body

       color:red

       font-size:12px

       

字体文件有  .svg  .ttf  .eot  .woff  .woff2  这些都是字体文件的后缀名


网页中 引入了太多的静态资源 会有这样的问题


1==


网页的加载速度变慢    因为会有很多的二次请求

         

它首页拿到网页中的 html标签  当他发现有srcipt或者src标签 等 标签 它就回去服务器去拿  如果静态资源多了

       

服务器就会变得很慢   一个网页要渲染出来  所以不止发送一次请求

     

2==


有处理错综复杂的依赖关系  如  bootstrap和jq之间的依赖关系

   

如何解决上述之间的问题:

   

1、合并 压缩 精灵图 图片的Base64编码(它适用于小的图片)

     

图片的Base64编码的做法比精灵图更加的好,因它要发送0次青丘   而精灵图至少要发送一次青丘    

     

2、可以使用requireJS  也可以使用webpack可以解决各个包之间复杂的依赖关系


什么是webpack


webpack是一个前端的项目构建工具  它是基于node.js开发出来的一个前端工具

     

所以要使用webpack  首先要安装node.js

     

如何完美的而解决上述的两个问题

     

1使用Gulp  2webpack      

     

1使用Gulp它是基于task任务的

     

2webpack 它是基于整个项目惊醒构建的  可以完美的实现资源的合并 打包  压缩 依赖

相关文章
|
8天前
|
缓存 JavaScript
webpack之SplitChunksPlugin
webpack之SplitChunksPlugin
26 0
|
8天前
|
JSON JavaScript 前端开发
|
8天前
|
前端开发 JavaScript Linux
|
8天前
|
前端开发 JavaScript 测试技术
对Webpack的理解
对Webpack的理解
27 0
|
5月前
|
JavaScript 前端开发
webpack
webpack
39 0
webpack
|
9月前
|
缓存 前端开发 JavaScript
浅谈webpack
浅谈webpack
88 0
|
前端开发 JavaScript
关于 Webpack 的介绍,什么是 Webpack?
Webpack 是一款现代化的前端构建工具,它可以将你的项目中的多个 JavaScript 模块打包成一个或多个 bundle 文件,同时还可以处理各种类型的静态资源,比如 CSS、图片等等。 Webpack 最初是由 Tobias Koppers 开发的,目前已经成为了前端开发中使用最广泛的构建工具之一。
119 0
|
缓存 算法
webpack的chunkFilename详细说明
webpack的chunkFilename详细说明
197 0
|
JavaScript 前端开发
从了解到使用webpack
Webpack本质上是一种前端资源编译,打包工具
70 0
|
前端开发 JavaScript
1、webpack
1、webpack
71 0

热门文章

最新文章