react.js使用webpack搭配环境的入门教程

前端之家收集整理的这篇文章主要介绍了react.js使用webpack搭配环境的入门教程前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

本文介绍了react.js使用webpack搭配环境的入门教程,分享给大家,也给自己做个笔记

如果你想直接上手开发,而跳过这些搭配环境的繁琐过程,推荐你使用官方的create-react-app命令

名称 cd my-app/ //进入my-app目录 npm start //运行项目

现在打开 http://localhost:3000/ 就能看到初始界面

我不大愿意使用官方自带这个脚手架,是因为它的webpack配置太复杂,我比较愚钝看不大懂,还望有大神能研究透彻分享一下。

要如何create-react-app内部的webpack配置文件解压出来?

代码

每次看教程我都喜欢先把项目跑起来,然后再一句一句代码地去了解。如果你也是:

一、创建项目结构

新建一个文件夹,命名为HelloReact

顺口提一下,我用的IDE是Sublime

在该文件夹内这样组织你的项目结构:

文件 |--build //项目build文件 |--index.html //索引html |--.babelrc //babel转码工具配置文件

|--package.json //npm说明文件,可以理解为包管理文件
|--webpack.config.js //webpack配置文件

在build/index.html中拷贝以下代码

<Meta charset="UTF-8"> ReactDemo1

猜你在找的JavaScript相关文章