filerjs · humphd · May 26, 2021 · Apr 4, 2021 · Apr 4, 2021 · Apr 4, 2021
diff --git a/README.md b/README.md
@@ -54,147 +54,66 @@ requirejs(['filer'], function(Filer) {...}
 var Filer = window.Filer;
 ```
 
-### Webpack
+### Webpack Plugin
 
-Filer can be used as a drop-in replacement for the node.js [fs module](http://nodejs.org/api/fs.html) using webpack.
-
-In order to use filer in place of fs, insert the following into your webpack config:
-
-```javascript
-// webpack.config.js
-module.exports = {
-  resolve: {
-    alias: {
-      'fs': 'filer/shims/fs.js',
-    }
-  }
-}
-```
-
-You can then import the node.js [fs module](http://nodejs.org/api/fs.html) as normal
-and the shim will ensure that calls to fs are appropriately handled by filer.
-
-```javascript
-import fs from 'fs';
-```
-
-If any calls are made to fs or fs.promises methods before the file system has been
-initialised, the shim will automatically delay the call until the file system is ready.
-
-If you're using filer in a typescript project, the fs shim has the added
-benefit of allowing you to use the types for the node.js [fs module](http://nodejs.org/api/fs.html),
-which filer tries to match as closely as possible. Note that some methods from fs are
-not available, even though typescript will tell you that they are! See [Getting Started](#getting-started)
-for more details on filers limitations.
-
-If you wish to use an alternative file system provider in place of the default (IndexedDB), you must also
-include an alias for this in your webpack config. For example, if you wish to use an "in memory"
-file system, configure webpack as shown below.
-
-```javascript
-// webpack.config.js
-module.exports = {
-  resolve: {
-    alias: {
-      'fsProvider': 'filer/shims/providers/memory.js',
-      'fs': 'filer/shims/fs.js',
-    }
-  }
-}
-```
-
-The current options for file system providers are:
-
-* Default (IndexedDB) - filer/shims/providers/default.js
-* IndexedDB - filer/shims/providers/default.js
-* Memory - filer/shims/providers/memory.js
-
-Though it's technically optional, it is recommended to include an alias for fsProvider in your
-webpack config. This will prevent webpack from logging unnecessary warnings.
-
-If you wish to use your own file system provider with the node.js [fs module](http://nodejs.org/api/fs.html)
-shim, it will be necessary to include an alias for fsProvider which points to your providers implementation.
-This can be done as follows:
+Filer can be used as a drop-in replacement for the node.js [fs](http://nodejs.org/api/fs.html) and
+[path](http://nodejs.org/api/path.html) modules. For convenience, filer provides a webpack plugin which
+will shim the desired node.js functionality. This plugin can be used by inserting the following into
+your webpack config:
 
 ```javascript
 // webpack.config.js
-const path = require('path');
+var filer = require('filer');
 
 module.exports = {
-  resolve: {
-    alias: {
-      'fsProvider': path.resolve(__dirname, 'example/dir/provider.js'),
-      'fs': 'filer/shims/fs.js',
-    }
-  }
-}
-```
-
-The node.js [path module](http://nodejs.org/api/path.html) also has a shim available, which can
-be applied in a similar manner to the node.js [fs module](http://nodejs.org/api/fs.html) shim.
-
-```javascript
-// webpack.config.js
-module.exports = {
-  resolve: {
-    alias: {
-      'path': 'filer/shims/path.js',
-    }
-  }
+  plugins: [
+    new filer.FilerWebpackPlugin(),
+  ],
 }
 ```
 
-You can then import the node.js [path module](http://nodejs.org/api/path.html) as normal and the
-shim will ensure that calls to path are appropriately handled by filer.
+You can then import the node.js [fs](http://nodejs.org/api/fs.html) and [path](http://nodejs.org/api/path.html)
+modules as normal and FilerWebpackPlugin will ensure that webpack will resolve references to these modules to
+the appropriate filer shims. You will then be able to use these modules as normal (with the exception of the
+synchronous fs methods e.g. `mkdirSync()`).
 
 ```javascript
+import fs from 'fs';
 import path from 'path';
 ```
 
-It may be necessary in certain cases to shim the node.js [Buffer object](http://nodejs.org/api/buffer.html). This can be impoerted as follows:
-
-```javascript
-import { Buffer } from 'buffer';
-```
-
-As such it can be shimmed in much the same way as path and fs:
+The filer webpack plugin will, by default, shim the [fs](http://nodejs.org/api/fs.html) and
+[path](http://nodejs.org/api/path.html) modules. However, it's behaviour can be customised by passing an
+options object.
 
 ```javascript
 // webpack.config.js
 module.exports = {
-  resolve: {
-    alias: {
-      'buffer': 'filer/shims/buffer.js',
-    }
-  }
+  plugins: [
+    new filer.FilerWebpackPlugin({
+      // Options
+    }),
+  ],
 }
 ```
 
-However, the Buffer object is globally defined in a node environment and many third party libraries will not import (or require) it.
-Using the resolve alias alone will be ineffective in such cases. Instead we must expand our webpack config to use webpacks
-[provide plugin](https://webpack.js.org/plugins/provide-plugin/), which will automatically load the module without the need for an import
-or require. This can be implemented as follows:
+The following options can be passed to the filer webpack plugin:
 
-```javascript
-// webpack.config.js
-const webpack = require('webpack');
+| Option        | Type    | Optional | Default                                          | Description                                                                                                                                      |
+|---------------|---------|----------|--------------------------------------------------|--------------------------------------------------------------------------------------------------------------------------------------------------|
+| filerDir      | string  | yes      | '\<rootDir\>/node_modules/filer'                 | The directory in which filer is installed.                                                                                                       |
+| shimsDir      | string  | yes      | '\<rootDir\>/node_modules/filer/shims'           | The directory in which the shims are installed.                                                                                                  |
+| fsProviderDir | string  | yes      | '\<rootDir\>/node_modules/filer/shims/providers' | The directory in which the shims are located. This option is required when using a custom provider.                                              |
+| shimFs        | boolean | yes      | true                                             | Should the fs module be shimmed.                                                                                                                 |
+| shimPath      | boolean | yes      | true                                             | Should the path module be shimmed.                                                                                                               |
+| fsProvider    | string  | yes      | 'default'                                        | The file system provider to use. Should be one of 'default', 'indexeddb', 'memory', 'custom'. The 'default' option is equivalent to 'indexeddb'. |
 
-module.exports = {
-  resolve: {
-    alias: {
-      'buffer': 'filer/shims/buffer.js',
-    }
-  },
-  plugins: [
-    new webpack.ProvidePlugin({
-      Buffer: ['buffer', 'Buffer'],
-    }),
-  ]
-}
-```
+NOTE: '\<rootDir\>' will be resolved to the current working directory.
 
-This will, in effect, make the Buffer object shim globally available in the same way that the node.js
-[Buffer object](http://nodejs.org/api/buffer.html) is in a node environment.
+Though filer also exposes the Buffer object, it is left up to the user to shim this as appropriate. This is because filer offers
+no custom implementation. Currently, filer uses the [node-libs-browser](https://github.com/webpack/node-libs-browser) Buffer implementation
+internally, though any faithful implementation of the [node.js Buffer object](http://nodejs.org/api/buffer.html) should play nicely
+with filer.
 
 ### Getting Started
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -46,7 +46,8 @@
   },
   "dependencies": {
     "es6-promisify": "^6.1.0",
-    "minimatch": "^3.0.4"
+    "minimatch": "^3.0.4",
+    "schema-utils": "^3.0.0"
   },
   "devDependencies": {
     "regenerator-runtime": "^0.13.7",

diff --git a/shims/buffer.js b/shims/buffer.js
diff --git a/shims/fs.js b/shims/fs.js
@@ -26,8 +26,16 @@ var fsInstance = new FileSystem({ provider }, (err) => {
   }
 });
 
+function proxyHasProp(target, prop) {
+  return prop in target;
+}
+
 const fsPromises = new Proxy(fsInstance.promises, {
   get(target, prop) {
+    if (!proxyHasProp(target, prop)) {
+      return;
+    }
+
     return async (...args) => {
       await fsReady;
       return await target[prop](...args);
@@ -37,6 +45,10 @@ const fsPromises = new Proxy(fsInstance.promises, {
 
 const fs = new Proxy(fsInstance, {
   get(target, prop) {
+    if (!proxyHasProp(target, prop)) {
+      return;
+    }
+
     if (prop === 'promises') {
       return fsPromises;
     }
@@ -50,7 +62,4 @@ const fs = new Proxy(fsInstance, {
   },
 });
 
-module.exports = {
-  __esModule: true,
-  default: fs,
-};
+module.exports = fs;
diff --git a/shims/path.js b/shims/path.js
@@ -1,6 +1,3 @@
 const { path } = require('../src/index');
 
-module.exports = {
-  __esModule: true,
-  default: path,
-};
+module.exports = path;
diff --git a/src/index.js b/src/index.js
@@ -8,7 +8,8 @@ module.exports = Filer = {
   Path: require('./path.js'),
   path: require('./path.js'),
   Errors: require('./errors.js'),
-  Shell: require('./shell/shell.js')
+  Shell: require('./shell/shell.js'),
+  FilerWebpackPlugin: require('./webpack-plugin'),
 };
 
 // Add a getter for the `fs` instance, which returns

diff --git a/src/path.js b/src/path.js
@@ -10,7 +10,7 @@ process.cwd = () => '/';
  * a few things we need for the browser environment.
  */
 const nodePath = require('path');
-const filerPath = Object.create(nodePath);
+const filerPath = Object.assign({}, nodePath);
 
 /**
  * Patch path.basename() to return / vs. ''