无意间看到这个打包工具,小试一下,不知道可不可以替代webpack广泛用于项目中,先自己抽空玩一玩吧.如果可以取代webpack的话那是极好的,毕竟配webpack我还是很嫌麻烦的.
Parcel 是一个网络应用打包工具, 适用于经验不同的开发者. 它利用多核处理提供了极快的速度, 并且不需要任何配置.
- 安装
npm install -g parcel-bundler
- 在你正在使用的项目目录下创建一个 package.json 文件:
npm init -y
- 安装react相关依赖
npm install --save react
npm install --save react-dom
npm install --save-dev babel-preset-react
npm install --save-dev babel-preset-env
npm install --save-dev parcel-bundler
- 新建一个 .babelrc
{
"presets": ["env", "react"]
}
- index.js
import React from "react";
import ReactDOM from "react-dom";
class HelloMessage extends React.Component {
render() {
return <div>Hello {this.props.name}</div>;
}
}
var mountNode = document.getElementById("app");
ReactDOM.render(<HelloMessage name="Jane" />, mountNode);
- index.html
<!DOCTYPE html>
<html>
<head>
<title>React starter app</title>
</head>
<body>
<div id="app"></div>
<script src="index.js"></script>
</body>
</html>
- package.json
"scripts": {
"start": "parcel index.html",
},
- 运行
npm start