webpack
文章平均质量分 79
webpack
砖业洋__
掘金/InfoQ签约作者,阿里云/51CTO专家博主,华为云·云享专家,CSDN博客专家,腾讯云·2023年度影响力创作者/优质共创者,擅长MySQL和Java领域,技术分享,全网同名———砖业洋__
展开
-
ES6本地实时转换ES5语法(供学习使用)
实际上babel是在项目中依托于webpack,这里单独提出来供学习对比语法使用文章目录非实时转换1.转换为单个文件2.多个文件分别转换实时监控准换在线转换如下babeljses6console(这个貌似翻墙才行)这里讲解本地转换和本地实时准换,供学习ES6和ES5的语法对比使用1.确保你已经安装好nodejs2.创建一个项目文件夹,比如babel-js3.进入到项目,执行 npm init -y 来初始化package.json,我个人使用的VScode,比较方便4.在终端Termi.原创 2020-10-04 16:28:52 · 1358 阅读 · 1 评论 -
webpack打包Library库文件指南
本文示例仓库地址:https://github.com/liuchenyang0515/Library_pack我们先新建2个js文件math.js如下export function add (a, b) { return a + b;}export function minus (a, b) { return a - b;}export function multiply (a, b) { return a * b;}export function divisi原创 2020-08-04 23:06:03 · 1508 阅读 · 0 评论 -
模块打包中CommonJS与ES6 Module的导入与导出问题详解
CommonJSCommonJS模块CommonJS中规定每个文件是一个模块。每个模块是拥有各自的作用域的,各自作用域的变量互不影响。// calculator.jsvar name = 'calculator.js';// index.jsvar name = 'index.js';require('./calculator.js');console.log(name); // index.js这里可以看到,导入calculator.js并不会覆盖index.js中的name字段这原创 2020-08-01 13:09:47 · 3418 阅读 · 1 评论 -
CommonJS与ES6 Module的本质区别
目录动态与静态值拷贝与动态映射循环依赖动态与静态动态与静态CommonJS与ES6 Module最本质的区别在于前者对模块依赖的解决是“动态的”,而后者是“静态的”。在这里“动态”的含义是,模块依赖关系的建立发生在代码运行阶段;而“静态”则是模块依赖关系的建立发生在代码编译阶段。让我们先看一个CommonJS的例子:// calculator.jsmodule.exports = { name: 'calculator' };// index.jsconst name = require('.原创 2020-07-31 17:09:55 · 2478 阅读 · 0 评论 -
webpack4.41+性能优化(高级篇)
以下配置是在webpack 4.43.0测试,文章末尾给出devDependencies可用于生产环境:babel-loader缓存优化ignorepluginnoparsehappyPackParallelUglifyPlugin不可用于生产环境的:自动刷新热更新DllPluginbabel-loader的缓存优化module: { rules: [ { test: /\.js$/, .原创 2020-07-19 16:16:09 · 2003 阅读 · 0 评论 -
2020前端面试题含解析汇总——基础篇(四)
您的关注收藏是我持续更新总结的动力!欢迎各位大佬不吝才华补充更全面的解析供大家参考~2020前端面试题含解析汇总——基础篇(一)2020前端面试题含解析汇总——基础篇(二)2020前端面试题含解析汇总——基础篇(三)2020前端面试题含解析汇总——基础篇(四)2020前端面试题含解析汇总——基础篇(五)本篇主要总结JQuery(17题)、Bootst...原创 2020-03-08 19:15:27 · 2317 阅读 · 0 评论 -
解决webpack打包静态资源(样式)无法添加厂商前缀-webkit -moz -ms -o的问题
可以设置以下browserlist,现在webpack默认你的项目支持高版本浏览器,你给支持的浏览器版本设置低一点,就出来前缀了我们在package.json里面加上如下内容重新打包运行就可以出来 "name":"lcy", "dependencies":{.....} // 加上下面的内容 "browserslist": [ "last 1 ve...原创 2020-02-23 11:52:48 · 3804 阅读 · 0 评论