無意間看到這個打包工具,小試一下,不知道可不可以替代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