- 博客(9)
- 收藏
- 关注
RSS订阅原创 webpack4系列教程（九）：开发环境和生产环境
1. 构建开发环境如果你一直跟随我前面的博文，那么你对webpack的基础知识已经有比较深刻的理解了。之前，我们一直执行着：npm run build来打包编译输出我们的代码，本文我们来看看如何构建一个开发环境，来使我们的开发变得方便些。1.1 webpack-dev-serverwebpack-dev-server是一个简单的小型的web服务器，并且能够实时重载，配置也很简单，首先安...
2019-01-17 21:56:12
883
原创 webpack4系列教程（八）：使用Eslint审查代码
前言：本章内容，我们在项目中加入eslint配置，来审查校验代码，这样能够避免一些比较低级的错误。并且在团队协作的时候，保持同一种风格和规范能提高代码的可读性，进而提高我们的工作效率。安装：eslint-config-standard 是一种较为成熟通用的代码审查规则，这样就不用我们自己去定义规则了，使用起来非常方便，记住还需要安装一些依赖插件：npm install --save-dev...
2019-01-14 22:04:53
1445
原创 webpack4系列教程（七）：使用 babel-loader
1. 什么是Babel如今 ES6 语法在开发中已经非常普及，甚至也有许多开发人员用上了 ES7 或 ES8 语法。然而，浏览器对这些高级语法的支持性并不是非常好。因此为了让我们的新语法能在浏览器中都能顺利运行，Babel 应运而生。Babel是一个JavaScript编译器，能够让我们放心的使用新一代JS语法。比如我们的箭头函数：() => console.log('hello ba...
2019-01-13 20:01:53
1322
原创 webpack4系列教程（六）：使用SplitChunksPlugin分割代码
1. SplitChunksPlugin的概念起初，chunks(代码块)和导入他们中的模块通过webpack内部的父子关系图连接.在webpack3中，通过CommonsChunkPlugin来避免他们之间的依赖重复。而在webpack4中CommonsChunkPlugin被移除，取而代之的是 optimization.splitChunks 和 optimization.runtimeC...
2019-01-10 22:12:24
2887
1
原创 webpack4系列教程（五）：处理项目中的资源文件（二）
传送门：webpack4系列教程（一）：初识webpackwebpack4系列教程（二）：创建项目，打包第一个JS文件webpack4系列教程（三）：自动生成项目中的HTML文件webpack4系列教程（四）：处理项目中的资源文件（一） 1. 在项目中使用 less 在 src/assets/ 下新建 common.less ：body{ background...
2019-01-07 16:26:46
183
原创 webpack4系列教程（四）：处理项目中的资源文件（一）
传送门：webpack4系列教程（一）：初识webpackwebpack4系列教程（二）：创建项目，打包第一个JS文件webpack4系列教程（三）：自动生成项目中的HTML文件 1. Loader的使用之前的博文已经介绍了Loader的概念以及用法，webpack 可以使用 loader 来预处理文件，这允许你打包除 JavaScript 之外的任何静态资源， 甚至允许...
2019-01-07 14:19:41
345
原创 webpack4系列教程（三）：自动生成项目中的HTML文件
传送门：webpack4系列教程（一）：初识webpackwebpack4系列教程（二）：创建项目，打包第一个JS文件 1. webpack中的CommonJS和ES Mudule 规范1.1 CommonJs规范CommonJs规范的出发点：JS没有模块系统、标准库较少、缺乏包管理工具；为了让JS可以在任何地方运行，以达到Java、PHP这些后台语言具备开发大型应用的能力...
2019-01-02 15:02:39
457
原创 webpack4系列教程（二）：创建项目，打包第一个JS文件
传送门：webpack4系列教程（一）：初识webpack 1. 创建项目1.1 初始化一个项目首先安装nodejs，打开 nodeJs官网 直接下载安装即可，安装完毕后打开命令行工具，进入你的项目文件夹，执行npm init 进行项目的初始化：过程中会让你填写项目名、版本、描述、仓库地址、关键字等信息，可以不填一路回车，执行完毕后会在根目录下创建一个 packag...
2019-01-01 15:42:33
859
原创 webpack4系列教程（一）：初识webpack
目录 1. 什么是webpack2. webpack核心概念 2.1 入口（entry）2.2 出口（output） 2.3 loader2.4 插件（plugins）1. 什么是webpack先来看看官网对webpack的介绍 ：本质上，webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 web...
2018-12-30 21:51:26
714
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人