feat(preprocess): add optimizeCarbonImports preprocessor (#499)

README.md

@@ -159,7 +159,78 @@ Using JavaScript:
 
 ```
 
-### TypeScript support
+## Preprocessors
+
+### optimizeCarbonImports
+
+`optimizeCarbonImports` is a Svelte preprocessor that optimizes base imports inside the `script` block of a Svelte file from the following libraries:
+
+- carbon-components-svelte
+- carbon-icons-svelte
+- carbon-pictograms-svelte
+
+The preprocessor rewrites base imports to directly import the source Svelte file. This may lead to faster complile times **during development**.
+
+Example:
+
+**Before**
+
+```js
+import { Button, Header } from "carbon-components-svelte";
+import { Notification20 } from "carbon-icons-svelte";
+import { Airplane } from "carbon-pictograms-svelte";
+```
+
+**After**
+
+```js
+import Button from "carbon-components-svelte/Button/Button.svelte";
+import Header from "carbon-components-svelte/UIShell/GlobalHeader/Header.svelte";
+import Notification20 from "carbon-icons-svelte/lib/Notification20/Notification20.svelte";
+import Airplane from "carbon-pictograms-svelte/lib/Airplane/Airplane.svelte";
+```
+
+#### svelte.config.js
+
+```js
+// svelte.config.js
+const {
+  optimizeCarbonImports,
+} = require("carbon-components-svelte/preprocess");
+
+module.exports = {
+  preprocess: [optimizeCarbonImports()],
+};
+```
+
+#### svelte-loader
+
+```js
+// webpack.config.js
+const {
+  optimizeCarbonImports,
+} = require("carbon-components-svelte/preprocess");
+
+module.exports = {
+  // ...
+  module: {
+    rules: [
+      {
+        test: /\.svelte$/,
+        use: {
+          loader: "svelte-loader",
+          options: {
+            hotReload: true,
+            preprocess: [optimizeCarbonImports()],
+          },
+        },
+      },
+    ],
+  },
+};
+```
+
+## TypeScript support
 
 [TypeScript definitions](types) are generated by [sveld](https://github.com/IBM/sveld).