update readme

README.md

@@ -58,22 +58,34 @@ Options:
     -h      --help      print help message
     -v      --version   output the version number
 ```
-## esmpack config files,
-
-if didn't provide a config path to the cli, will search for config file in the `process.cwd()` for file name `esmpack.config.js` if not found, then search for  `esmpack.config.mjs`, then `esmpack.config.json`, if non of them found, will exits with error code.
 
 ### Javascript Config file
 
- - js config file, proved a way to connect `esmpack` with any plugin, the built-in plugins can be called by its name `css, html, json, text, image, audio`.
-if no plugins had provided, will add the built-in plugins as default;  
+js config file, proved a way to connect `esmpack` with any plugin, the built-in plugins can be called by its name `css, html, json, text, image, audio`.
+
+- The built in plugin, will try to fetch the resource with `fetch` request.
+- The Built-in plugin provide 3 different information about the resource file:
+ - 1-  `value` : content itself, its type controlled by the plugin, import `.json` file will return json object, import `.txt`, `.css` and `.html` will return a string object.
+ - 2- `url` : a url for the resources.
+ - 3- `promise`: the promise to listen, to be notified with the fetch result.
 
- - JS Module File, to create and load plugins, The built in plugin, will try to fetch the resource with `fetch` request, and will be defined then.
+```ts
+declare module '*.html' {
+    export default value;
+    export const value: string;
+    export const url: string;
+    export const promise: Promise<string>;
+}
 
- - The Built-in plugin provide 3 different information about the resource file, 
-    - 1-  `value` : content itself, its type controlled by the plugin, import `.json` file will return json object, import `.txt`, `.css` and `.html` will return a string object.
-    - 2- `url` : a url for the resources.
-    - 3- `promise`: the promise to listen, to be notified with the fetch result.
+import htmlFile, {url as appUrl, promise as appPromise}  from './app-root.html';
+// will be transformed to
 
+let htmlFile;
+const appUrl; 
+const appPromise;
+```
+
+if didn't provide a config path to the cli, will search for config file in the `process.cwd()` for file name `esmpack.config.js` if not found, then search for  `esmpack.config.mjs`, then `esmpack.config.json`, if non of them found, will exits with error code.
 
 Could be a js module file with default export as `JSConfig Interface` object. in that case make sure the `package.json` is marked as module package, `{"type": "module"}`. this options is useful for nodejs when (importing a non `.mjs`) OR ( import `.js`) file.
 
@@ -291,30 +303,19 @@ export interface JSConfig {
 }
 ```
 
-
-# How to build A Plugin
+## How to build A Plugin
 
 - for now all built-in plugin intercepting only `import` statement, `export` statement not implemented yet.
-```ts
-/**
- *  inject: replace import statement with code.
- * `fetch`: replace the import statement with a fetch request code, from the inline.
- *  module: convert the resource file to a js module, and import its default.
- * 
- *  inline: hold code to be replaced with the import statement.
- */
 
-class PluginAction { action: 'inject' | 'fetch' | 'module', inline?: string }
+```ts
+class PluginAction { action: 'replace' | 'fetch' | 'module', inline?: string }
 let pdfHandler = (importSyntax: ImportSyntax, relativeFilePath: string): PluginAction => {
     // write plugin for pdf files
     return {action: 'module'};
 };
 
-/**
- * provide a new plugin with the help of built-in plugin behavior.
- */
+// provide a new plugin with the help of built-in plugin behavior.
 let mdPluginHandler = new Plugin('text');
-
 let pngImage = new Plugin('objectURL');
 
 let config = {
@@ -328,22 +329,24 @@ let config = {
     ]
 }
 ```
-possible moduleType are: 
-  `text`, `json`, `blob`, `arrayBuffer`, `file`, `uint8`, `objectURL`, `base64` and `dataBase64`.
 
+`replace:` replace import statement with code.
+`fetch`: replace the import statement with a fetch request code, from the inline.
+`module`: convert the resource file to a js module, and import its default.
+`inline`: hold code to be replaced with the import statement.
+`moduleType` value could be: `text`, `json`, `blob`, `arrayBuffer`, `file`, `uint8`, `objectURL`, `base64` and `dataBase64`.
 
+## Example 
 
- ## Example 
+`app/file.html`
 
- `app/file.html`
-
- ```html
+```html
  <h1> Hello from HTML</h1>
- ```
+```
 
- `app/main-module.js`
+`app/main-module.js`
 
- ```ts
+```ts
 import htmlContent, {url, promise, html} from './file1.html';
 
 console.log(htmlContent);   // print undefined
@@ -360,7 +363,7 @@ promise.then(content => {
 })
 .catch(reason => console.error('failed loading html file'));
 
- ```
+```
 
 `@aurora/esmpack` support operator `as` for renaming the default exported names in the wildcard
 
@@ -378,11 +381,10 @@ textPromise.then(content => {
     ....
 });
 
- ```
+```
 
 `@aurora/esmpack` support operator `export` from a non-js file.
 
-
 ```ts
 /// <reference types="@aurorats/types" />
 
@@ -395,7 +397,7 @@ export * from './file.txt';
 
 export {url as imageUrl, jpg as imageObject} from './image.jpg';
 export * as image from './image.jpg';
- ```
+```
 
 ## TO:DO