AS_TS的博客

运行，会打包后会产生dist或build目录一般情况下，直接打开dist 或 build 目录下的index.html会在浏览器看到内容。然而发现网页一片空白，打开了控制台，看到一片404的各种找不到资源，或者出现跨域的提示。

webpack-dev-server 是 Webpack 官方推出的一款开发工具，根据它的名字我们就应该知道，它提供了一个开发服务器，并且将自动编译和自动刷新浏览器等一系列对开发友好的功能全部集成在了一起。webpack-dev-server 的NPM地址：https://www.npmjs.com/package/webpack-dev-server1. 安装运行安装 webpack-dev-servernpm install webpack-dev-server --save-dev或y

webpack 插件[plugins]loader 被用于转换某些类型的模块，而插件则可以用于执行范围更广的任务。插件的范围包括，从打包优化和压缩，一直到重新定义环境中的变量。插件接口功能极其强大，可以用来处理各种各样的任务。想要使用一个插件，你只需要 require() 它，然后把它添加到 plugins 数组中。多数插件可以通过选项(option)自定义。你也可以在一个配置文件中因为不同目的而多次使用同一个插件，这时需要通过使用 new 操作符来创建它的一个实例。清理dist文件夹使用 np

使用 webpack API 中的 compiler 钩子，可以在特定的时期进行操作compiler 钩子Compiler 模块是 webpack 的支柱引擎，它通过 CLI 或 Node API 传递的所有选项，创建出一个 compilation 实例。它扩展(extend)自 Tapable 类，以便注册和调用插件。大多数面向用户的插件首，会先在 Compiler 上注册。此模块会暴露在 webpack.Compiler，可以直接通过这种方式使用。关于更多信息，请查看这个示例。监听(watch

*在 VScode 中设置 webpack.config.js 文件的智能提示可以有效的帮助我们进行对应的属性配置在文件 webpack.config.js 中导入 Configuration 模块，通过类型注释的方式，将配置对象标注为该导入类型，这个类型就是webpack内部对配置对象的类型声明，之后再进行属性配置的时候就会有类型提示== 注意：==在运行webpack前要先注释掉 import { Configuration } from 'webpack' ，在 nodejs 中还不支持