No Problemo Muchacho

    remix-mount-routes
    TypeScript icon, indicating that this package has built-in type declarations

    0.1.3 • Public • Published

    Remix Mount Routes

    All Contributors

    This package enables you to mount your Remix app at a different path than root.

    🛠 Installation

    > npm install -D remix-mount-routes

    ⚙️ Configuration

    Update your remix.config.js file and use the custom routes config option.

    Call mountRoutes(basePath, routesDir, ignoredRouteFiles?) and return the route manifest.

    NOTE: basePath should be an absolute path (e.g., /myapp) and routesDir should be relative to the app folder.

    Depending on your setup, you may also need to update publicPath and assetsBuildDirectory to include your basePath. This will ensure that your assets will be served properly.

    You can either hard-code the basePath in your config file, or use an environment variable like:

    "build": "cross-env REMIX_BASEPATH=/myapp remix build",
    "dev": "cross-env REMIX_BASEPATH=/myapp remix dev",
    // remix.config.js
    const { mountRoutes } = require('remix-mountroutes')
    
    const basePath = process.env.REMIX_BASEPATH ?? ''
    
    module.exports = {
      ignoredRouteFiles: ['.*'],
      // publicPath: `${basePath}/build/`,
      // assetsBuildDirectory: `public${basePath}/build`,
      routes: defineRoutes => {
        // /myapp => app/routes/index.tsx
        const baseRoutes = mountRoutes('/myapp', 'routes')
        // /test => app/addins/test/index.tsx
        const testRoutes = mountRoutes('/test', 'addins/test')
    
        // use standard Remix defineRoutes API
        // /some/path/* => app/addins/catchall.tsx
        const customRoutes = defineRoutes(route => {
          route('/some/path/*', 'addins/catchall.tsx')
        })
        const routes = {
          ...baseRoutes,
          ...testRoutes,
          ...customRoutes,
        }
        return routes
      },
    }

    💡 Sample Web App

    Here's a repo with a sample app mounted to /myapp

    https://github.com/kiliman/remix-mount-routes-example

    And here's the running app

    https://remix-mount-routes-example.herokuapp.com

    😍 Contributors

    Thanks goes to these wonderful people (emoji key):


    Kiliman

    💻 📖

    This project follows the all-contributors specification. Contributions of any kind welcome!

    Keywords

    Install

    npm i remix-mount-routes

    DownloadsWeekly Downloads

    241

    Version

    0.1.3

    License

    MIT

    Unpacked Size

    27.6 kB

    Total Files

    9

    Last publish

    Collaborators

    • kiliman