webpack教程--03loader

loader就是webpack用来预处理模块的,在一个模块被引入之前,会预先使用loader处理模块内容

还是上一节课的代码,这节课我们会引入react,首先进行两个操作 

  • npm i
  • npm i -S react react-dom

然后会看到package.json里面出现了这几行代码,表明react安装成功

webpack教程--03loader 

然后在app.js中添加以下代码

webpack教程--03loader

但是因为js文件里面包含了<div>元素,就会报错。这个时候webpack就会解决这个问题,首先运行安装这两个东西

npm i -D babel-loader babel-core 

npm i -D babel-preset-react

然后添加以下代码

webpack教程--03loader

界面出现这个成功

webpack教程--03loader