Awesome Open Source
Awesome Open Source

Redirect Module 🔀 No more cumbersome redirects!

npm version npm downloads Circle CI Codecov Dependencies Standard JS

Nuxt module to dynamically redirect initial requests

📖 Release Notes

Features

Redirecting URLs is an often discussed topic, especially when it comes to SEO. Previously it was hard to create a "real" redirect without performance loss or incorrect handling. But this time is over!

Setup

  1. Add the @nuxtjs/redirect-module dependency with yarn or npm to your project
  2. Add @nuxtjs/redirect-module to the modules section of nuxt.config.js:
  3. Configure it:
{
  modules: [
    ['@nuxtjs/redirect-module', {
      // Redirect option here
    }]
  ]
}

Using top level options

{
  modules: [
    '@nuxtjs/redirect-module'
  ],
  redirect: [
    // Redirect options here
  ]
}

Options

rules

  • Default: []

Rules of your redirects.

onDecode

  • Default: (req, res, next) => decodeURI(req.url)

You can set decode.

onDecodeError

  • Default: (error, req, res, next) => next(error)

You can set callback when there is an error in the decode.

statusCode

  • Default: 302

You can set the default statusCode which gets used when no statusCode is defined on the rule itself.

Usage

Simply add the links you want to redirect as objects to the module option array:

redirect: [
  { from: '^/myoldurl', to: '/mynewurl' }
]

You can set up a custom status code as well. By default, it's 302!

redirect: [
  { from: '^/myoldurl', to: '/mynewurl', statusCode: 301 }
]

As you may have already noticed, we are leveraging the benefits of Regular Expressions. Hence, you can fully customize your redirects.

redirect: [
  { from: '^/myoldurl/(.*)$', to: '/comeallhere' }, // Many urls to one
  { from: '^/anotherold/(.*)$', to: '/new/$1' } // One to one mapping
]

Furthermore you can use a function to create your to url as well 👍 The from rule and the req of the middleware will be provided as arguments. The function can also be async!

redirect: [
  {
    from: '^/someUrlHere/(.*)$',
    to: (from, req) => {
      const param = req.url.match(/functionAsync\/(.*)$/)[1]
      return `/posts/${param}`
    }
  }
]

And if you really need more power... okay! You can also use a factory function to generate your redirects:

redirect: async () => {
  const someThings = await axios.get("/myApi") // It'll wait!
  return someThings.map(coolTransformFunction)
}

Now, if you want to customize your redirects, how your decode is done or when there is some error in the decode, you can also:

redirect: {
  rules: [
    { from: '^/myoldurl', to: '/mynewurl' }
  ],
  onDecode: (req, res, next) => decodeURI(req.url),
  onDecodeError: (error, req, res, next) => next(error)
}

ATTENTION: The factory function must return an array with redirect objects (as seen above).

Gotchas

The redirect module will not work in combination with nuxt generate. Redirects are realized through a server middleware, which can only react when there is a server running.

Development

  1. Clone this repository
  2. Install dependencies using yarn install or npm install
  3. Start development server using npm run dev

License

MIT License

Copyright (c) Alexander Lichter [email protected]


Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (68,100) 
nuxt (216) 
seo (129) 
nuxtjs (120) 
nuxt-module (70) 

Find Open Source By Browsing 7,000 Topics Across 59 Categories

Advertising 📦 10
All Projects
Application Programming Interfaces 📦 124
Applications 📦 192
Artificial Intelligence 📦 78
Blockchain 📦 73
Build Tools 📦 113
Cloud Computing 📦 80
Code Quality 📦 28
Collaboration 📦 32
Command Line Interface 📦 49
Community 📦 83
Companies 📦 60
Compilers 📦 63
Computer Science 📦 80
Configuration Management 📦 42
Content Management 📦 175
Control Flow 📦 213
Data Formats 📦 78
Data Processing 📦 276
Data Storage 📦 135
Economics 📦 64
Frameworks 📦 215
Games 📦 129
Graphics 📦 110
Hardware 📦 152
Integrated Development Environments 📦 49
Learning Resources 📦 166
Legal 📦 29
Libraries 📦 129
Lists Of Projects 📦 22
Machine Learning 📦 347
Mapping 📦 64
Marketing 📦 15
Mathematics 📦 55
Media 📦 239
Messaging 📦 98
Networking 📦 315
Operating Systems 📦 89
Operations 📦 121
Package Managers 📦 55
Programming Languages 📦 245
Runtime Environments 📦 100
Science 📦 42
Security 📦 396
Social Media 📦 27
Software Architecture 📦 72
Software Development 📦 72
Software Performance 📦 58
Software Quality 📦 133
Text Editors 📦 49
Text Processing 📦 136
User Interface 📦 330
User Interface Components 📦 514
Version Control 📦 30
Virtualization 📦 71
Web Browsers 📦 42
Web Servers 📦 26
Web User Interface 📦 210