Parcel,零配置开发 React 应用!

本文译自 Create a React app with zero configuration using Parcel。

webpack 已经经历三四年的发展,社区和技术趋于成熟,它已经成为了前端开发中的必备工具。那问题来了,会有新的工具来挑战 webpack 的地位吗?各位不妨看看本文的 Parcel,说不定就是未来的主角。

一开始使用 React 的痛苦想必大家都经历过。在真正进入编码之前,需要花大量的时间搞清楚如何配置 webpack。

Create React App 项目的流行就是因为它简化了配置,加快了项目初始化的速度。俗话说,成也风云,败也风云。将 webpack 配置隐藏既是它的优点,也是它的缺点。随着项目不断地扩大,你可能想做一些高级配置,就需要将 webpack 配置从 Create React App “拖”(eject)出来,这段配置异常复杂,这就回到了老问题——webpack 还是得学习啊!

最近,一个新的构建工具 Parcel 出现了,它是零配置的!真的不敢相信有这么好的东西,看起来所有问题都将迎刃而解。

我在一个大项目中尝试使用 Parcel,效果拔群。build 出包经过优化,要知道用 webpack 的时候,我需要花数天时间来实现相同的优化。

我想这个工具潜力无限,我们一起来看看如何使用它来轻松搭建一个 React 应用。

使用 Parcel 开发 React 应用

首先,创建一个 NPM 项目:

会询问你一些问题,直接按 键使用默认值即可。

下一步安装 React、babel 和 Parcel 依赖:

接下来,创建 文件,告诉 parcel 我们使用 ES6 和 React JSX:

创建 React App,就两个文件:

index.js:

index.html:

现在,只需要在 添加一个启动脚本就可以把我们的应用跑起来了:

搞定,启动:

访问 就可以打开我们的 App 了。

目前 parcel 仅支持 node 8 或者以上版本。

Github 开源

在 Github 上 可以找到完整的代码。如果你觉得有帮助,欢迎 ★。

比起 webpack 一堆繁琐的配置,这个要简单多了!

Parcel 或许是 Create React App 一个不错的替代。你肯定关心 parcel 现在是否足够稳定用于生产环境。不太确定,看看事情怎么发展吧,不过它值得关注!

本文来自企鹅号 - 前端外刊评论媒体

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏SAP最佳业务实践

SAP最佳业务实践:使用看板的生产制造(233)-11重复制造反冲

1、MFBF重复制造反冲 此活动在单个步骤中执行多个活动,如产成品的收货、组件物料的反冲、成本到成本收集器的过帐以及物料和会计凭证的创建。 反冲时可能会出现错误...

3505
来自专栏向治洪

android studio设置代理更新

我们都知道Android Studio是基于IDEA开发的,而我们写的每一个程序又都是有Gradle构建的,Gradle的优点可以说是很多,被很多程序员夸得没...

4626
来自专栏令仔很忙

Hybrid app(二)----开发主要应用技术

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型,使其轻量...

3731
来自专栏用户2442861的专栏

必不可少的Firefox插件

Adblock Plus 去广告,包括youku的开头广告 All-in-One Sidebar 最大的好处就是省去书签栏 NoSquint :用firefo...

5791
来自专栏hotqin888的专栏

推荐批量优化pdf文件的软件

http://www.pc6.com/softview/SoftView_14796.html

2492
来自专栏CRPER折腾记

MacOS : 前端必备姿势(工作环境)

算是爬出来了...此篇的工作设备是(Macbook Pro 2017款,所以可能会说到 touchbar!)

5460
来自专栏猿人谷

新安装 Ubuntu 12.10 需要做的 10 件事

1. 了解一下ubuntu 12.10 ubuntu 12.10 使用 unity 桌面基于gtk3 开发的桌面,新版本原装加入连个lens但是对于国内用户来说...

2029
来自专栏一“技”之长

iOS9系列专题三——应用瘦身 原

        apple在iOS9中引入了一套新的app瘦身方案,通过一些优化策略,将尽可能的减小app安装包的体积。这部分的大多工作是由app store来...

872
来自专栏鹅厂优文

开发效率太低?您可能没看这篇文章

还记得刚参加工作的时候, 有位开发的同事软件使用效率奇高. 我曾亲眼目睹他在几秒之内打开开发软件, 优雅地调出隐藏的功能, 输入数据输出结果的过程行云流水, 一...

7452
来自专栏CSDN技术头条

竟然用了30多个开源软件,支付宝也是厉害了

在支付宝中的“设置”选项中,有一项为“关于”,在版权信息中显示了所有使用的开源软件信息。不看不知道,一看吓一跳,原来支付宝居然使用了30多个开源软件,

1763

扫码关注云+社区

领取腾讯云代金券