欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Parcel配置public靜態(tài)文件目錄過程解析

 更新時(shí)間：2023年06月14日 10:44:08   作者：天問  
這篇文章主要為大家介紹了Parcel配置public靜態(tài)文件目錄實(shí)現(xiàn)過程解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪

一、前言

最近使用 Parcel 搭建一個(gè) Mock Service Worker （MSW）的測(cè)試服務(wù)，遇到一個(gè)問題：在 MSW 中注冊(cè) Service Worker 的文件（mockServiceWorker.js）是以靜態(tài)文件相對(duì)路徑加載，但是在 Parcel 啟動(dòng)的服務(wù)中加載不到此文件，導(dǎo)致 Service Worker 服務(wù)無(wú)法注冊(cè)。

Parcel && Public

Mock Service Worker (MSW) 是一個(gè)令人興奮的 API 模擬工具，它使用 Service Worker 攔截您的 HTTP 請(qǐng)求。這將允許您發(fā)出可以使用 DevTools 檢查的實(shí)際 HTTP 請(qǐng)求，因?yàn)?MSW 在服務(wù)工作者級(jí)別上工作。MSW 也可以在您的測(cè)試代碼中使用，這樣您就不必為 HTTP 響應(yīng)設(shè)置額外的測(cè)試模擬。

二、問題解析

Parcel 默認(rèn)是將所有文件打包進(jìn) js 包中，不存在有單獨(dú)的靜態(tài)文件目錄，類似于 Vue 和 React 腳手架生成項(xiàng)目的根目錄下的 public/ 文件夾。

三、解決方案

下載插件 parcel-plugin-static-files-copy 來(lái)支持單獨(dú)的靜態(tài)文件打包。

  • 安裝插件
npm install -D parcel-plugin-static-files-copy
  • 配置 package.json
// package.json
{
    // ...
    "staticFiles": {
        "staticPath": "public",
        "watcherGlob": "**"
    }
}
  • 重啟服務(wù)
npm start

拓展：

  • 多靜態(tài)文件夾配置
// package.json
{
    // ...
    "staticFiles": {
        "staticPath": ["public", "src/assets"]
    }
}
  • 指定輸出文件夾
// package.json
{
    // ...
    "staticFiles": {
        "staticPath": [
            {
                "outDirPattern": "**/assets",
                "staticPath": "dir1"
            },
            {
                "outDirPattern": "**/static",
                "staticPath": "dir2"
            }
        ]
  },
}

以上就是Parcel配置public靜態(tài)文件目錄過程解析的詳細(xì)內(nèi)容，更多關(guān)于Parcel配置public的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！

相關(guān)文章

最新評(píng)論