{"id":27333,"library":"react-middleware","title":"react-middleware","description":"Connect middleware for serving React components from a standard folder structure (v2.2.4). Allows building React-based sites with a convention-over-configuration approach, automatically compiling assets via webpack. Includes automatic CSS handling from adjacent .styl/.css files, support for custom webpack loaders, and integration with Express. Last updated in 2016, with low release cadence. Differentiates by enforcing a specific folder structure and providing server-side compilation, but is outdated compared to modern frameworks like Next.js.","status":"maintenance","version":"2.2.4","language":"javascript","source_language":"en","source_url":"https://github.com/philcockfield/react-middleware","tags":["javascript","react,express,connect,middleware,server"],"install":[{"cmd":"npm install react-middleware","lang":"bash","label":"npm"},{"cmd":"yarn add react-middleware","lang":"bash","label":"yarn"},{"cmd":"pnpm add react-middleware","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency for rendering React components","package":"react","optional":false},{"reason":"used for server setup and routing","package":"express","optional":true},{"reason":"used internally for asset compilation","package":"webpack","optional":false}],"imports":[{"note":"Package uses default export. In CJS, require() returns the default export; ensure .default is accessed if needed.","wrong":"const ReactMiddleware = require('react-middleware')","symbol":"default","correct":"import ReactMiddleware from 'react-middleware'"}],"quickstart":{"code":"import ReactMiddleware from 'react-middleware';\nimport express from 'express';\n\nconst app = express();\nconst site = ReactMiddleware({ base: './example/site' });\nsite.build()\n  .then(() => {\n    app\n      .use(site)\n      .listen(3030, () => {\n        console.log('Listening on port', 3030);\n      });\n  });","lang":"javascript","description":"Basic server setup using ReactMiddleware with Express, including build step and listening on port 3030."},"warnings":[{"fix":"Migrate to a current SSR framework.","message":"Package is no longer actively maintained; consider using modern frameworks like Next.js or Gatsby.","severity":"deprecated","affected_versions":">=2.0"},{"fix":"Ensure you call site.build() and wait for it to resolve before mounting.","message":"The build() method must be called before using the middleware to ensure assets are compiled.","severity":"gotcha","affected_versions":">=2.0"},{"fix":"If you need default loaders, include them in your custom array.","message":"Custom webpack loaders passed via `webpackLoaders` replace the default loaders entirely.","severity":"gotcha","affected_versions":">=2.0"},{"fix":"Use init() only once on a fresh folder, or manually create the structure.","message":"The init() method overwrites existing folder structure if called on an existing directory.","severity":"gotcha","affected_versions":">=2.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Run `npm install react-middleware`.","cause":"Package not installed or not in node_modules.","error":"Error: Cannot find module 'react-middleware'"},{"fix":"Use `const ReactMiddleware = require('react-middleware').default;` or switch to ESM import.","cause":"Default import not used correctly in CJS.","error":"TypeError: ReactMiddleware is not a function"},{"fix":"Ensure you call `ReactMiddleware({ base: './site' })` which returns an object with build method.","cause":"ReactMiddleware() called incorrectly (maybe missing `new` or object options).","error":"Error: build() is not a function"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}