@promoboxx/react-scripts-vite 0.1.23 → 0.1.24

package/README.md

@@ -36,6 +36,57 @@ Put this in `src/react-scripts-vite.d.ts`:
 /// <reference types="@promoboxx/react-scripts-vite/dist/client" />
 ```
 
+## Customization
+
+`react-scripts-vite` exports both a `viteConfig` function and an `pluginOptions` object. The `pluginOptions` object lets you customize the included plugins. And if you'd like to add your own plugins, or change any of the vite config, you're free to do so.
+
+### Changing included plugin options
+
+```typescript
+import { viteConfig, pluginOptions } from '@promoboxx/react-scripts-vite'
+
+// Setting one of the properties to `false` turns off the plugin entirely.
+// Not sure why you would want to though.
+pluginOptions.react = false
+pluginOptions.pwa = {
+  registerType: 'autoUpdate',
+}
+
+export default viteConfig
+```
+
+### Changing included vite config
+
+```typescript
+import { defineConfig } from 'vite'
+import { viteConfig, pluginOptions } from '@promoboxx/react-scripts-vite'
+
+// Disable SVGR.
+pluginOptions.svgr = false
+// Change PWA config.
+pluginOptions.pwa = {
+  registerType: 'autoUpdate',
+}
+
+export default defineConfig(async (env) => {
+  // await is needed so the type isn't `UserConfig | Promise<UserConfig>`
+  const config = await viteConfig(env)
+
+  return {
+    ...config,
+    plugins: [
+      // Add whatever plugins you want.
+      YourVitePlugin(),
+    ].concat(config.plugins),
+    build: {
+      ...config.build,
+      // Turn off sourcemaps.
+      sourcemap: false,
+    },
+  }
+})
+```
+
 ## Migrating from react-scripts
 
 Should be very straightforward. For application code, everything should be supported out of the box.

package/dist/cli.js

@@ -1,5 +1,16 @@
 #!/usr/bin/env node
 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
         if (ar || !(i in from)) {
@@ -14,22 +25,27 @@ var child_process_1 = require("child_process");
 function main(command, args) {
     switch (command) {
         case 'start':
-            spawnAndExit('./node_modules/.bin/vite', args);
+            spawnAndExit('./node_modules/.bin/vite', args, {
+                NODE_ENV: 'development',
+            });
             break;
         case 'test':
-            spawnAndExit('./node_modules/.bin/vitest', args);
+            spawnAndExit('./node_modules/.bin/vitest', args, { NODE_ENV: 'test' });
             break;
         case 'build':
-            spawnAndExit('./node_modules/.bin/vite', __spreadArray(['build'], args, true));
+            spawnAndExit('./node_modules/.bin/vite', __spreadArray(['build'], args, true), {
+                NODE_ENV: 'production',
+            });
             break;
         default:
             throw new Error("Unknown command: ".concat(command));
     }
 }
-function spawnAndExit(command, args) {
+function spawnAndExit(command, args, env) {
     if (args === void 0) { args = []; }
     var child = (0, child_process_1.spawn)(command, args, {
         stdio: 'inherit',
+        env: __assign(__assign({}, process.env), env),
         // shell: true,
     });
     child.on('exit', function (code) {

package/dist/index.d.ts

@@ -1 +1 @@
-export { default as viteConfig } from './viteConfig';
+export { default as viteConfig, pluginOptions } from './viteConfig';

package/dist/index.js

@@ -3,7 +3,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.viteConfig = void 0;
+exports.pluginOptions = exports.viteConfig = void 0;
 var viteConfig_1 = require("./viteConfig");
 Object.defineProperty(exports, "viteConfig", { enumerable: true, get: function () { return __importDefault(viteConfig_1).default; } });
+Object.defineProperty(exports, "pluginOptions", { enumerable: true, get: function () { return viteConfig_1.pluginOptions; } });
 //# sourceMappingURL=index.js.map

package/dist/viteConfig.d.ts

@@ -1,2 +1,18 @@
-declare const _default: import("vitest/dist/config").UserConfig;
-export default _default;
+import react from '@vitejs/plugin-react';
+import { UserConfigFn } from 'vite';
+import pluginChecker from 'vite-plugin-checker';
+import envCompatible from 'vite-plugin-env-compatible';
+import { VitePWA } from 'vite-plugin-pwa';
+import svgr from 'vite-plugin-svgr';
+import tsconfigPaths from 'vite-tsconfig-paths';
+interface ReactScriptsViteOptions {
+    react?: false | Parameters<typeof react>[0];
+    svgr?: false | Parameters<typeof svgr>[0];
+    envCompatible?: false | Parameters<typeof envCompatible>[0];
+    tsconfigPaths?: false | Parameters<typeof tsconfigPaths>[0];
+    pwa?: false | Parameters<typeof VitePWA>[0];
+    checker: false | Parameters<typeof pluginChecker>[0];
+}
+export declare const pluginOptions: ReactScriptsViteOptions;
+declare const viteConfig: UserConfigFn;
+export default viteConfig;

package/dist/viteConfig.js

@@ -3,6 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.pluginOptions = void 0;
 var fs_1 = __importDefault(require("fs"));
 var plugin_react_1 = __importDefault(require("@vitejs/plugin-react"));
 var vite_plugin_checker_1 = __importDefault(require("vite-plugin-checker"));
@@ -10,10 +11,28 @@ var vite_plugin_env_compatible_1 = __importDefault(require("vite-plugin-env-comp
 var vite_plugin_pwa_1 = require("vite-plugin-pwa");
 var vite_plugin_svgr_1 = __importDefault(require("vite-plugin-svgr"));
 var vite_tsconfig_paths_1 = __importDefault(require("vite-tsconfig-paths"));
-var config_1 = require("vitest/config");
 var ENV_PREFIX = 'REACT_APP_';
-exports.default = (0, config_1.defineConfig)({
+exports.pluginOptions = {
+    checker: {
+        eslint: process.env.DISABLE_ESLINT_PLUGIN === 'true'
+            ? undefined
+            : {
+                lintCommand: "eslint --max-warnings=".concat(process.env.CI === 'true' ? 0 : -1, " \"./src/**/*.{ts,tsx,js,jsx,mjs,cjs}\""),
+            },
+        typescript: process.env.TSC_COMPILE_ON_ERROR !== 'true',
+        enableBuild: true,
+    },
+    envCompatible: {
+        prefix: ENV_PREFIX,
+    },
+    react: {
+        fastRefresh: process.env.FAST_REFRESH !== 'false',
+        jsxRuntime: process.env.DISABLE_NEW_JSX_TRANSFORM === 'true' ? 'classic' : undefined,
+    },
+};
+var viteConfig = function () { return ({
     base: process.env.PUBLIC_URL,
+    // TODO This doesn't really fit in with pluginOptions.
     envPrefix: ENV_PREFIX,
     build: {
         outDir: process.env.BUILD_PATH || 'build',
@@ -24,32 +43,22 @@ exports.default = (0, config_1.defineConfig)({
     },
     plugins: [
         // React specific.
-        (0, plugin_react_1.default)({
-            fastRefresh: process.env.FAST_REFRESH !== 'false',
-            jsxRuntime: process.env.DISABLE_NEW_JSX_TRANSFORM === 'true'
-                ? 'classic'
-                : undefined,
-        }),
-        (0, vite_plugin_svgr_1.default)(),
+        exports.pluginOptions.react === false ? null : (0, plugin_react_1.default)(exports.pluginOptions.react),
+        exports.pluginOptions.svgr === false ? null : (0, vite_plugin_svgr_1.default)(exports.pluginOptions.svgr),
         // import.meta.env -> process.env
-        (0, vite_plugin_env_compatible_1.default)({
-            prefix: ENV_PREFIX,
-        }),
+        exports.pluginOptions.envCompatible === false
+            ? null
+            : (0, vite_plugin_env_compatible_1.default)(exports.pluginOptions.envCompatible),
         // Support TypeScript paths.
-        (0, vite_tsconfig_paths_1.default)(),
+        exports.pluginOptions.tsconfigPaths === false
+            ? null
+            : (0, vite_tsconfig_paths_1.default)(exports.pluginOptions.tsconfigPaths),
         // PWA.
-        (0, vite_plugin_pwa_1.VitePWA)(),
+        exports.pluginOptions.pwa === false ? null : (0, vite_plugin_pwa_1.VitePWA)(exports.pluginOptions.pwa),
         // Check for issues.
-        process.env.NODE_ENV !== 'test' &&
-            (0, vite_plugin_checker_1.default)({
-                eslint: process.env.DISABLE_ESLINT_PLUGIN === 'true'
-                    ? undefined
-                    : {
-                        lintCommand: "eslint --max-warnings=".concat(process.env.CI === 'true' ? 0 : -1, " \"./src/**/*.{ts,tsx,js,jsx,mjs,cjs}\""),
-                    },
-                typescript: process.env.TSC_COMPILE_ON_ERROR !== 'true',
-                enableBuild: true,
-            }),
+        process.env.NODE_ENV === 'test' || exports.pluginOptions.checker === false
+            ? null
+            : (0, vite_plugin_checker_1.default)(exports.pluginOptions.checker),
     ],
     server: {
         open: true,
@@ -71,5 +80,6 @@ exports.default = (0, config_1.defineConfig)({
         environment: 'jsdom',
         setupFiles: './src/test/setup.ts',
     },
-});
+}); };
+exports.default = viteConfig;
 //# sourceMappingURL=viteConfig.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@promoboxx/react-scripts-vite",
-  "version": "0.1.23",
+  "version": "0.1.24",
   "description": "",
   "main": "dist/index.js",
   "keywords": [],