TyrionJ的博客

配置合并或三元表达式webpack开发环境和生产环境配置文件有两种方式获取当前环境变量process.env.NODE_ENV，针对开发环境或者生产环境在配置文件中使用三元表达式使用相应的loader或者plugin.webpack-merge合并配置文件打包变量区分开发或生产环境需要安装cross-envyarn add cross-env -D在package.json件中...

前言本文不讲述webpack devServer proxy跨域原理，只说最简单的配置webpack配置...devServer: { contentBase: './dist', port: 1234, open: false, proxy: { '/api': 'http://localhost:9999' } } ...我...

babel是什么？官网：Babel 是一个工具链，主要用于将 ECMAScript 2015+ 版本的代码转换为向后兼容的 JavaScript 语法，以便能够运行在当前和旧版本的浏览器或其他环境中。工具链针对ECMA 2015+ ，低于ECMA2015+不必使用babel为了是使用ECMA2015+的最新特性（语法，API等）在当前或者低版本浏览器能运行.babel安装使用bab...

本文主要介绍AST，DCE,着重介绍tree shaking以及如何在webpack中使用treeshaking.AST抽象语法树（Abstract Syntax Tree）也称为AST语法树，指的是源代码语法所对应的树状结构。也就是说，对于一种具体编程语言下的源代码，通过构建语法树的形式将源代码中的语句映射到树中的每一个节点上。 可以通过在线演示AST来看相关demo

代码分割和懒加载webpack实际源码

postcsspostcss是一个工具，它允许使用JS插件对样式进行装换，这里所说的插件有很多，最常用的是Autoprefixer 。这些插件可以检查（lint）你的 CSS，支持 CSS Variables 和 Mixins， 编译尚未被浏览器广泛支持的先进的 CSS 语法，内联图片，以及其它很多优秀的功能。 postcss插件有很多，本文介绍三个插件,更多的插件可以参考官方githubpostc

传统上我们会在html文件中引入CSS代码，借助webpack style-loader和css-loader我们可以在.js文件中引入css文件并让样式生效。style-loader和css-loader作用是不同的。css-loader: 加载.css文件style-loader:使用<style>将css-loader内部样式注入到我们的HTML页面

打包插件：CommonsChunkPlugin插件中文网站 || 插件英文官网如何使用//安装webpack//webpack.config.js文件中引入webpack模块// 关于options具体信息请参考官网cnpm install webpack --save-dev //安装webpackvar Webpack = require('webpack')plugin

1.为什么需要模块化可能很多同学是通过index.html,style.css,demo.js接触进入前端开发的，但在实际项目中会复杂的多，开发者为了重复造轮子对常用的实现进行封装实现了一个库，后来的开发者为了避免重复造轮子想使用其他开发者已经造好的轮子，但是直接引用他人的库可能会造成变量污染和冲突。 一种解决方式是命名空间。var NameSpace = {}NameSpace.ty

github地址英文文档中文文档1.webpack是什么？A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting allows to load parts for the application on demand. Through “lo

entry: 打包入口output：打包出口loadersplugins：使用的插件entry告诉webpack使用哪个文件作为构建依赖图的起点，比如指定app.js作为entry，webpack会分析app.js使用到的模块，并解析模块中使用到的模块以此类推，最终将前端静态资源按一定规则打包成一个或多个静态文件。

什么是babel babel is a JavaScript Compiler,这是官网上的一句话，简单来说，babel是一个转译工具，目标是对使用当前浏览器还没有完全支持的JavaScript规范比如ES2016，ES2017,TypeScrit等开发的代码进行转译，转译后的代码浏览器就能支持并解析。2.babel怎么用查看最新版本安装babelnpm install babel-loader