Parcel 入門 (一)


  Parcel 是一個Web應用程序打包器(bundler),與以往的開發人員使用的打包器不同。它利用多核處理提供極快的性能,並且不需要進行任何配置。

安裝

Yarn:

yarn global add parcel-bundler

 

Npm:
npm install -g parcel-bundler

 

二、 創建package.json文件;

Yarn:
yarn init -y

 

npm:
npm init -y

 

三、 啟動 
  Parcel可以將任何類型的文件作為入口點,但是HTML 或 JavaScript 文件是一個很好的開始。如果你使用相對路徑將你的主javaScript文件鏈接到HTML中,Parcel也會為你處理,並
將該引用替換為輸出文件的URL。

創建一個index.html 和 index.js 文件。
index.html
<!DOCTYPE html>
<html>
<head>
    <title>Parcel 入門</title>
</head>
<body>
    <script type="text/javascript" src="./index.js"></script>
</body>
</html>

 

index.js
alert('Hello, world!');

 

  1. Parcel 內置了一個開發服務器,在你更改文件時自動重建你的應用程序,並支持模塊熱替換,以便快速開發。你只需指定入口文件即可:
parcel index.html

 運行成結果為:

已經啟動成功。在瀏覽器中打開http://localhost:1234,會出現彈框。

 

    2.  你也可以使用-p <port number>選擇覆蓋默認接口。

parcel index.html -p 2345

 

       3. 如果您沒有自己的服務器。或者你的應用完全是客戶端渲染的,那么請使用開發服務器。如果你有自己的服務器,你可以在watch 模式下運行parcel。這樣文件更改時,parcel仍然會自動重建文件,並支持模塊熱替換,但不啟動web服務器。

  

parcel watch index.html

 




 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM