Parcel 配方(Recipes)
2020-02-14 17:26 更新
配方(Recipes)
React
首先需要安裝 React 相關(guān)的依賴。
npm install --save react
npm install --save react-dom
npm install --save-dev parcel-bundler或者如果你安裝了 Yarn 包管理器
yarn add react
yarn add react-dom
yarn add --dev parcel-bundler添加 start 指令到 package.json
// package.json
"scripts": {
"start": "parcel index.html"
}Preact
首先需要安裝 Preact 相關(guān)的依賴。
npm install --save preact
npm install --save-dev parcel-bundler或者如果說(shuō)你安裝了 Yarn 包管理器，作為 npm 的備選
yarn add preact
yarn add --dev parcel-bundler向 package.json 的 scripts 中添加 start 腳本。
// package.json
"scripts": {
"start": "parcel index.html"
}Vue
首先，我們需要安裝 Vue 的依賴關(guān)系。
npm install --save vue
npm install --save-dev parcel-bundler或者如果說(shuō)你安裝了 Yarn 包管理器，作為 npm 的備選
yarn add vue
yarn add --dev parcel-bundler向 package.json 的 scripts 中添加 start 腳本。
// package.json
"scripts": {
"start": "parcel index.html"
}Typescript
首先，我們需要添加 Parcel 和 Typescript 到你的項(xiàng)目里。
npm install --save-dev typescript
npm install --save-dev parcel-bundler或者如果說(shuō)你安裝了 Yarn 包管理器，作為 npm 的備選
yarn add --dev typescript
yarn add --dev parcel-bundler從 index.html 開(kāi)始編譯
添加 start 腳本到package.json
// package.json
"scripts": {
"start": "parcel index.html"
}接著，在你的index.html文件，簡(jiǎn)單的引入你的.ts文件
<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<head> </head>
<body>
<!-- 這里 ???? -->
<script src="./myTypescriptFile.ts"></script>
</body>
</html>完成！
直接編譯.ts文件
添加 start 腳本到package.json
// package.json
"scripts": {
"start": "parcel myTypescriptFile.ts"
}完成！???? 在 dist 文件夾中將發(fā)現(xiàn)編譯后的.js文件
以上內(nèi)容是否對(duì)您有幫助：
更多建議：