![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
模块化
文章平均质量分 90
火鸡面多放火鸡
简单分享一下前端知识
展开
-
webpack5.X使用webpack-dev-server
webpack5.X使用webpack-dev-server启动服务器一、安装使用二、配置选项https://webpack.js.org/guides/development-vagrant/一、安装使用yarn add webpack-dev-server --dev启动服务器yarn webpack serve因为webpack5.X与webpack-dev-server有些冲突,无法直接使用webpack-dev-server启动服务,只能通过这种方式去调用webpack-dev-s原创 2020-11-28 17:21:13 · 7718 阅读 · 6 评论 -
webpack常用插件(clean,html,copy)
webpack常用插件(clean,html,copy)一、clean-webpack-plugin二、html-webpack-plugin三、copy-webpack-plugin一、clean-webpack-plugin安装clean-webpack-pluginyarn add clean-webpack-plugin --dev配置const path = require("path")const { CleanWebpackPlugin } = require("clean-we原创 2020-11-28 16:38:45 · 370 阅读 · 0 评论 -
webpack使用html-loader加载js中引入的html资源
webpack使用html-loader加载js中引入的html资源一、如何使用html-loader二、html-loader配置一、如何使用html-loader安装yarn add html-loader --dev配置webpack.config.jsmodule.exports = { ..., // 其他配置 module:{ rules:[ { test:/.html$/,原创 2020-11-28 11:32:34 · 4154 阅读 · 0 评论 -
webpack使用file-loader与url-loader处理图片资源加载
webpack使用file-loader与url-loader处理图片资源加载一、使用file-loader加载图片资源二、使用url-loader加载图片三、打包后图片路径不对的问题一、使用file-loader加载图片资源安装file-loaderyarn add file-loader --dev配置module:{ rules:[ { test:/.jpg|.png$/, use:'fil原创 2020-11-28 10:48:24 · 1060 阅读 · 0 评论 -
webpack使用babel-loader编译ES新特性
webpack使用babel-loader编译ES新特性一、安装babel-loader以及配置二、测试效果一、安装babel-loader以及配置yarn add babel-loader @babel/core @babel-preset-env --devwebpack.config.js配置module.exports = { mode:"none",// 三种工作模式: none | production | development entry:"./src/index.原创 2020-11-28 10:22:52 · 554 阅读 · 0 评论 -
对于webpack使用心得
对于webpack使用心得一、在项目中安装webpack二、示例三、webpack配置文件四、webpack工作模式一、在项目中安装webpack初始化package.jsonyarn init --yes安装webpack及其核心模块yarn add webpack webpack-cli --dev安装webpack-cli后,我们就能通过yarn或者npm执行webpack命令yarn webpack --version// 查看webpack和webpack-cli版本,确认安装原创 2020-11-25 11:05:05 · 196 阅读 · 0 评论 -
为什么我们需要模块打包工具
为什么我们需要模块打包工具前言一、模块化的问题1、ES Module存在环境兼容问题2、模块文件多,网路请求频繁3、所有前端资源都需要模块化小结二、提出一些设想前言模块化很好的解决了我们在复杂应用开发中的代码组织问题,但是随着我们引入模块化,我们的应用又会产生一些新的问题。一、模块化的问题1、ES Module存在环境兼容问题首先第一个就是我们所使用的ES Module这样一款模块系统,它本身就存在环境兼容问题,尽管现如今主流浏览器的最新版本都已经支持这样一个特性了。但是我们目前还没有办法去做到原创 2020-11-24 17:40:32 · 560 阅读 · 0 评论