一群青红椒的博客

利用react可以有效进行组件的开发与管理。其中webpack作为构建react组件的有效工具，可以大大提高我们的开发效率与使用效果。网上也有了很多入门文章。 但是，由于react与webpack版本的迭代导致这些入门介绍教程，或因存在版本变动，或因存在api变动，或因内容含糊而导致遇到很多坑。因此，记录了一下前段时间一次搭建过程，介绍如何基于webpack搭建一个最简单的react开发环境。

前言在一些单页面应用中，通过打包工具将需要处理、相互依赖的模块直接打包成一个bundle，在页面第一次载入时，就会将所有的js全部载入。但是，往往有许多的场景，我们并不需要在一次性将单页应用的全部依赖都载下来。为了防止用户在第一次打开页面时，需要等待较长时间加载无关资源，我们就可以考虑进行一定的代码拆分（code splitting）。

CSS是一门15分钟就能入门，但是却需要很长很长的时间才能掌握好的语言。它有着它自身的一些复杂性与局限性。其中非常重要的一点就是，本身不具备模块化的能力。本文旨在说明如何使用webpack中的local scope功能实现CSS的模块化。