首页
沸点
课程
数据标注
HOT
AI Coding
更多
直播
活动
APP
插件
直播
活动
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
登录
注册
webpack基础学习
Inspire尘
创建于2021-11-21
订阅专栏
webpack的基础学习
暂无订阅
共11篇文章
创建于2021-11-21
订阅专栏
默认顺序
默认顺序
最早发布
最新发布
webpack基础知识学习(十一)--打包优化
1.分包---splitChunks 可以对第三方引入的插件分开打包 2.代码懒加载。我们对首次加载不需要的代码设置延迟加载,或者在需要的时候才加载。通过import()函数实现。 prefetch会
webpack基础知识学习(十)--区分打包环境
通过前面的学习,我们的打包模式一直是在development环境下进行的,接下来我们就要区分开发和生产环境的webpack配置了。 1.新建文件夹config。再创建3个文件webpack.commo
webpack基础知识学习(九)--开发环境下的一些配置
前面说到我们都通过webpack-dev-server插件来实现搭建开发环境的,我们在开发环境下,往往需要修改一些配置来方便我们开发。接下来就介绍一些对开发有用的配置。 配置接口代理 通常我们做项目就
webpack基础知识学习(八)--热更新hmr
什么是热更新呢?他允许我们在更新模块时,页面不需要完全刷新,能做到局部刷新。 webpack-dev-server配置热更新 在入口文件下,添加热更新针对的模块。 之后我们重新运行npm run se
webpack基础知识学习(七)--本地服务器搭建
通过前面的学习,我们每次测试我们修改的文件是否正确,我们都要手动的去运行npm run build操作,然后查看页面是否更新,而且我们还用到了vscode的插件--live-server,这样不适十分
webpack基础知识学习(六)--javascript转换
在我们项目开发中,我们现在会用jsx、ts、es6+等不被浏览器识别的语言或者特性,这时候我们就需要一个工具转换这些特性。这就是我们要用babel的原因,他非常类似postcss插件。 1.安装插件
webpack基础知识学习(五)--插件plugin
plugin跟loader有什么区别呢? 我们通过前面写的loader可以看出,loader是为来处理各种各种的文件而存在的,可以简单理解为他把浏览器不能识别的文件转换成能识别的文件,比如jsx,le
webpack基础知识学习(四)--字体
在处理业务时,我们也会用到字体库,加下来我们就学习webpack自带的asset属性来处理字体。 1.我们去iconfont的官网去下载一个字体库,按照说明我们把它引入到项目中。 2.创建一个标签,添
webpack基础知识学习(三)--图片转换
通常我做网站时,会用到图片资源,那一般有两种引入方式,一是img标签的src属性,而是通过css的background-image属性来家在图片,那这两种模式我们怎么在webpack中打包呢?接下来就
webpack基础知识学习(二)--css的转换
上一小节我们打包的js文件,但是对于我们前端,js只是其中的一部分,接下来我们要打包css。 1.修改js文件,我们动态创建一个div标签,然后通过css给这个标签添加样式。在src下创建css文件夹
webpack基础知识学习(一)--entry/output
我们想象一下,为什么我们在项目中可以处理less,可以引入图片,可以使用js的高级特性等,而我们的游览器并不能解析他们,却依然得到了我们想要的结果,那是谁在帮我们做这一件事呢?答案显而易见----we