详解基于webpack搭建react运行环境

前端之家收集整理的这篇文章主要介绍了详解基于webpack搭建react运行环境前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

最近由于项目需要,所以尝试使用webpack搭建react运行环境,在克服了一系列困难后,终于能在页面输出"Hello World",特地把整个过程记录下来,利人利己。

首先我创建了一个文件webpack-helloworld-demo,之后的大部分操作都会在这个文件夹下进行。

1.初始化文件

文件 git init //产生.git文件,便于之后版本提交回退

2.搭建webpack环境

--save建议使用,这样当别人clone你的代码时,只需要npm install就可以安装好所有需要的依赖,并且你也可以在你的package.json文件夹中看到你使用的哪些依赖。

现在我们可以测试下webpack有没有安装成功,在文件夹根目录下创建三个文件,分别是entry.jsbundle.jsindex.html文件内容分别如下。

<Meta charset="UTF-8"> test

浏览器访问 http://localhost:3000/ , 页面显示Hello World,运行成功!

现在我们的文件目录为:

至此我们就搭建好了一个简单的环境啦~

框架Github地址:https://github.com/DQing/webpack-helloworld-demo.git

大家在搭建框架时不要忘了小步提交。

还可以进行一些额外的配置,步骤其实都差不多

框架Github地址:https://github.com/DQing/jishiben.git

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

猜你在找的JavaScript相关文章