gxy5202 / parcel-namer-hashless Goto Github PK

View Code? Open in Web Editor NEW

8.0 2.0 0.0 14.03 MB

⭐A parcel plugin which make your bundle file‘s name without hash

Home Page: https://www.npmjs.com/package/parcel-namer-hashless

License: MIT License

TypeScript 100.00%

javascript parcel parcel-bundler parcel-plugin hash

parcel-namer-hashless's Introduction

parcel-namer-hashless

Feature

This plugin will help you remove the hash from a bundle file name(only support parcel v2.x).

Note: since v1.0.4, need your parcel >= v2.8.3

Why

If you are using parcel to package files, you may encounter the following situations. When you package index.html that references other files, parcel treats those files as shared bundles and adds a hash to the file name by default, even if you set --no-content-hash in package.json.

So when you need a filename without any hash value, using this plugin can help you. For example, when you are developing a web browser extension, you need all file names to be stable and hashless

Installation

npm: npm i parcel-namer-hashless -D

yarn: yarn add parcel-namer-hashless -D

pnpm: pnpm add parcel-namer-hashless -D

Useage

Edit .parcelrc file to add new namer:

/* .parcelrc */
{
  "extends": "@parcel/config-default",
  "namers": [ "parcel-namer-hashless" ]
}

Configuration

parcel-namer-hashless exists as an optional field in package.json.

If you want to remove the hash values of all filenames, ignore this field.

If you want precise control over certain files, you can configure the include or exclude field

include: string[]: The file that you want to remove the hash from
exclude: string[]: The file that you don't want to remove the hash from

use regular expressions

// package.json

"parcel-namer-hashless": {
    "include": [".js$", ".css$", '.card.png$']
}
// or
"parcel-namer-hashless": {
    "exclude": [".css$"]
}
// or
"parcel-namer-hashless": {
  "include": [".js$", ".css$", '.card.png$']
  "exclude": [".background.png$"]
}

mode allows you to control which environments take effect

mode: 'all' | 'development' | 'production': production as default.

// package.json

"parcel-namer-hashless": {
    "include": [".js$", ".css$", '.card.png$'],
    "mode": 'all'
}

Result

If you run the plugin successfully, the terminal will output：

parcel-namer-hashless: index.794a6267.js -> index.js

Issue

Error: Bundles must have unique names: There is a <script> tag in your index.html file. In this case, parcel will generate a index.js file. So if you have another <script> tag to import 'main.ts', parcel will generate two index.js file. But we should notice that the first index.js file will not output as a file in your dist. So i delete your first <script> tag, then everything works fine.

parcel-namer-hashless's People

Contributors

Stargazers

Watchers

parcel-namer-hashless's Issues

Build failed: Cannot read properties of undefined (reading 'mode')

Using parcel-namer-hashless: 1.0.6 and parcel/[email protected]:

If I just include "namers": [ "parcel-namer-hashless" ], as part of the "extends": "@parcel/config-default", block in .parcelrc (I have a few other reporters and resolvers in there too but no other namers) but nothing in package.json, I get the following error on pnpm build:

🚨 Build failed.

parcel-namer-hashless: Cannot read properties of undefined (reading 'mode')

  TypeError: Cannot read properties of undefined (reading 'mode')
      at 
  /path/to/node_modules/.pnpm/[email protected]_@[email protected]/node_modules/parcel-namer-hashless/lib/index.js:1:1859
      at step (/path/to/node_modules/.pnpm/[email protected]/node_modules/tslib/tslib.js:195:27)
      at Object.next (/path/to/node_modules/.pnpm/[email protected]/node_modules/tslib/tslib.js:176:57)
      at asyncGeneratorStep 
  (/path/to/node_modules/.pnpm/@[email protected]/node_modules/@swc/helpers/cjs/_async_to_generator.cjs:5:28)
      at _next 
  (/path/to/node_modules/.pnpm/@[email protected]/node_modules/@swc/helpers/cjs/_async_to_generator.cjs:23:17)
      at process.processTicksAndRejections (node:internal/process/task_queues:95:5)

 ELIFECYCLE  Command failed with exit code 1.

If I add the following to package.json, the build executes successfully

    "parcel-namer-hashless": {
        "mode": "all"
    },

The instructions say, however, this block is optional if you want to remove/omit the hashes from everything.

Is this a misconfiguration at my end or a does the lack of a mode setting need trapping in the plugin?