• Stars
    star
    153
  • Rank 243,368 (Top 5 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created about 7 years ago
  • Updated about 3 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Multi-threaded generator command for nuxt.js

Multi-threaded generate command for Nuxt.js

Build Status Windows Build Status Coverage Status npm npm (scoped with tag)

Use multiple workers to generate the static files for your Nuxt.js project

Setup

Install the package

yarn add nuxt-generate-cluster

Add a generate script to your package.json

  "scripts": {
    "generate": "nuxt-generate -w 4"
  }

Nuxt config options

Configure the generate options in nuxt.config.js

  generate: {
    workers: 4,
    workerConcurrency: 500,
    concurrency: 500,
    routes (callback, params) {
      return axios.get('https://api.example.com/routes?since=' + params.lastFinished)
      .then((res) => {
        return res.data
      })
    },
    done ({ duration, errors, workerInfo }) {
      if (errors.length) {
        axios.post('https://api.example.com/routes', { generate_errors: errors })
      }
    }
  }

workers

  • Default: number of processors

The number of workers that should be started. It probably has no use to start more workers then number of processors in your system.

workerConcurrency

  • Default: 500

To even the load between workers they are sent batches of routes to generate, otherwise a worker with 'easy' routes might finish long before others. Workers will also still use the concurrency option from Nuxt.

routes

The default Nuxt.js routes method has been extended so you can pass additional parameters to it, see params parameter in example config under Setup. By default it will list 3 timestamps:

  • lastStarted The unix timestamp when the nuxt-generate command was last executed, should be just now

  • lastBuilt The unix timestamp when the nuxt project was last built by nuxt-generate

  • lastFinished The unix timestamp when nuxt-generate last finished succesfully (eg not interrupted by ctrl+c)

Timestamps are locally stored in ~/.data-store/nuxt-generate-cluster.json, see data-store

beforeWorkers

This method is called on the master just before the workers are started/forked. It receives the Nuxt options as first argument.

Use this method if you experience serialization issues or when your Nuxt config is too big. The Nuxt options are stringified and then passed as environment variable to the workers, on Windows there seems to be a maximum size of 32KB for env variables.

Properties which should be safe to remove are (not a complete list):

  • buildModules (and their options)
  • serverMiddleware

done

This method will be called when all workers are finished, it receives two arguments:

  • The first argument is an object with statistics:

    • duration The total time in seconds that the command ran

    • errors An array of all the errors that were encountered. Errors can have type handled or unhandled, for the latter the error message will contain the stacktrace

    [ { type: 'handled',
        route: '/non-existing-link',
        error:
         { statusCode: 404,
           message: 'The message from your 404 page' } }
    ]
    • workerInfo An object with detailed information about each worker. Data passed is from the watchdog object that we use internally to monitor the worker status.
    {{ '6707':                            // the process id of the worker
       { start: [ 1929158, 859524606 ],   // process.hrtime the worker was started
         duration: 109567,                // how long the worker was active
         signal: 0,                       // the signal by which the worker was killed (if any)
         code: 0,                         // the exit status of the worker
         routes: 73,                      // the number of routes generated by this worker
         errors: [] },                    // the errors this worker encountered, errors of all workers
                                          // combined is the error argument above
    }
  • The second argument is the Nuxt instance

Command-line options

Please note that you need to explicitly indicate with -b that you want to (re-)build your project

$ ./node_modules/.bin/nuxt-generate -h

  Multi-threaded generate for nuxt using cluster

  Description
    Generate a static web application (server-rendered)
  Usage
    $ nuxt-generate <dir>
  Options
    -b, --build           Whether to (re-)build the nuxt project
    -c, --config-file     Path to Nuxt.js config file (default: nuxt.config.js)
    -h, --help            Displays this message
    -p, --params          Extra parameters which should be passed to routes method
                            (should be a JSON string or queryString)
    -q, --quiet           Decrease verbosity (repeat to decrease more)
    -v, --verbose         Increase verbosity (repeat to increase more)
    --fail-on-page-error  Immediately exit when a page throws an unhandled error
    -w, --workers [NUM]   How many workers should be started
                            (default: # cpus)
    -wc [NUM],            How many routes should be sent to
    --worker-concurrency [NUM]    a worker per iteration

If you need to have more control which routes should be generated, use the -p option to pass additional parameters to your routes method.

# nuxt.config.js
generate: {
  routes (callback, params) {
    console.log(params)
  }
}

$ nuxt-generate -w 2 -p id=1&id=2
// will print =>
{ id: [ '1', '2' ],
  lastStarted: 1508609323,
  lastBuilt: 0,
  lastFinished: 0 }

If you are using a npm script under bash use -- to pass the parameters to nuxt-generate instead of npm:

$ npm run generate -- -p '{ "id": [1,2,3] }'
// will print =>
{ id: [ 1, 2, 3 ],
  lastStarted: 1508786574,
  lastBuilt: 0,
  lastFinished: 0 }

Logging

You can use multiple -v or -q on the command-line to increase or decrease verbosity. We use consola for logging and set a default log level of 3 unless DEBUG is set, then its 5. If you want to log debug messages without setting DEBUG you can use -vv on the command-line

The difference between log levels 2, 3 and 4 are:

  • Level 2 (-q) Only print master messages like worker started / exited. No worker messages.

  • Level 3 Also print which routes the workers generated

  • Level 4 (-v) Also print how much time the route generation took and messages between master and workers

More Repositories

1

auth-module

Zero-boilerplate authentication support for Nuxt 2
TypeScript
1,926
star
2

legacy-modules

JavaScript
1,285
star
3

express-template

Starter template for Nuxt 2 with Express.
Vue
1,248
star
4

pwa-module

Zero config PWA solution for Nuxt.js
TypeScript
1,236
star
5

axios-module

Secure and easy axios integration for Nuxt 2
JavaScript
1,199
star
6

tailwindcss-module

Tailwind CSS module for Nuxt
TypeScript
1,023
star
7

i18n-module

i18n for Nuxt
JavaScript
959
star
8

color-mode-module

Dark and Light mode with auto detection made easy with Nuxt πŸŒ—
TypeScript
743
star
9

device-module

Nuxt.js module for detecting device type.
TypeScript
735
star
10

composition-api

Composition API hooks for Nuxt 2.
TypeScript
710
star
11

sitemap-module

Sitemap Module for Nuxt 2
JavaScript
688
star
12

typescript-template

Typescript starter for Nuxt 2
Vue
642
star
13

firebase-module

πŸ”₯ Easily integrate Firebase into your Nuxt project. πŸ”₯
JavaScript
641
star
14

google-analytics-module

Google Analytics Module for Nuxt 2
JavaScript
638
star
15

vuetify-module

Vuetify Module for Nuxt 2
TypeScript
629
star
16

starter-template

DEPRECATED: use create-nuxt-app instead
Vue
607
star
17

style-resources-module

Style Resources for Nuxt 3
TypeScript
574
star
18

sentry-module

Sentry module for Nuxt 2
TypeScript
500
star
19

dotenv-module

Loads your .env file into your application context
JavaScript
492
star
20

adonuxt-template

[Deprecated] Starter template for Nuxt.js with AdonisJS.
JavaScript
451
star
21

proxy-module

The one-liner node.js http-proxy middleware solution for Nuxt 2 using http-proxy-middleware
TypeScript
408
star
22

router-module

Nuxt 2 module to use router.js instead of pages/ directory.
TypeScript
401
star
23

nuxt-property-decorator

Property decorators for Nuxt (base on vue-property-decorator)
JavaScript
396
star
24

nuxtent-module

Seamlessly use content files in your Nuxt.js sites.
TypeScript
389
star
25

koa-template

Starter template for Nuxt.js with KoaJS.
JavaScript
382
star
26

svg-module

Super simple svg loading module for Nuxt.js
JavaScript
338
star
27

gtm-module

Google Tag Manager Module for Nuxt.js
JavaScript
327
star
28

nuxt7

πŸ“± Full Featured iOS & Android PWA Apps with Nuxt.js and Framework7
TypeScript
324
star
29

redirect-module

No more cumbersome redirects for Nuxt 2!
JavaScript
310
star
30

storybook

Storybook integration with Nuxt.js
TypeScript
293
star
31

router-extras-module

Extra Add-ons For Nuxt 2 Router
JavaScript
279
star
32

universal-storage-module

Universal Storage Utilities for Nuxt 2
TypeScript
276
star
33

strapi-module

Strapi Module for Nuxt
TypeScript
269
star
34

robots-module

NuxtJS module for robots.txt
TypeScript
268
star
35

dayjs-module

Day.js module for your Nuxt 2 project.
TypeScript
261
star
36

google-fonts-module

Google Fonts module for NuxtJS
TypeScript
256
star
37

recaptcha-module

πŸ€– Simple and easy Google reCAPTCHA integration with Nuxt.js
JavaScript
252
star
38

svg-sprite-module

Optimize SVG files and combine them into sprite
TypeScript
252
star
39

electron-template

Electron starter with nuxt.js
JavaScript
251
star
40

feed-module

Everyone deserves RSS, ATOM and JSON feeds!
JavaScript
227
star
41

google-optimize-module

SSR friendly Google Optimize module for Nuxt.js
JavaScript
215
star
42

amp-module

AMP Module for Nuxt 2
Vue
204
star
43

python-module

Write Nuxt 2 applications using Python! [Experimental]
Vue
201
star
44

moment-module

Efficient Moment.js integration for Nuxt
JavaScript
194
star
45

prismic-module

Easily connect your Nuxt.js application to your content hosted on Prismic
JavaScript
180
star
46

hackernews-nuxt-ts

Typescript Version of HackerNews Nuxt
Vue
174
star
47

google-gtag-module

Enable google gtagjs for NuxtJs
JavaScript
147
star
48

partytown-module

Partytown integration for Nuxt. Run third-party scripts from a web worker.
TypeScript
138
star
49

pwa-template

PWA template for vue-cli based on the starter template
Vue
133
star
50

blog-module

Build your blog with @nuxt
JavaScript
132
star
51

cloudinary-module

Integration of Cloudinary to Nuxt.js
TypeScript
129
star
52

module-template

Starter template for Nuxt.js Modules
JavaScript
127
star
53

sanity-module

Sanity integration for Nuxt
TypeScript
126
star
54

nuxt-logrocket

LogRocket module for Nuxt.js
TypeScript
121
star
55

google-adsense-module

Google AdSense module for Nuxt.js
Vue
117
star
56

nuxt-class-component

ES / TypeScript decorator for class-style Nuxt/Vue components
TypeScript
113
star
57

fontawesome-module

Module to use Font Awesome icons in Nuxt.js
JavaScript
110
star
58

localforage-module

Localforage module for Nuxt.js
JavaScript
88
star
59

laravel-echo-module

Laravel Echo for Nuxt 2
TypeScript
85
star
60

webpackmonitor-module

Monitor nuxt webpack optimization metrics through the development process using webpackmonitor
JavaScript
83
star
61

eslint-module

ESLint module for Nuxt.js
TypeScript
78
star
62

date-fns-module

Modern JavaScript date utility library - date-fns for Nuxt.js
JavaScript
78
star
63

onesignal-module

OneSignal for Nuxt 2
TypeScript
74
star
64

micro-template

Starter template for Nuxt.js with Ξ” micro
JavaScript
73
star
65

emotion-module

πŸ’– Emotion module for Nuxt.js
TypeScript
63
star
66

ngrok-module

ngrok exposes your localhost to the world for easy testing and sharing! No need to mess with DNS or deploy just to have others test out your changes
TypeScript
62
star
67

separate-env-module

Tear your variables apart!
JavaScript
57
star
68

harlem-module

Harlem integration for Nuxt. A state management solution for Vue 3.
TypeScript
56
star
69

global-components

Module to register global components for Nuxt.js
JavaScript
55
star
70

netlify-files-module

Nuxt 2 module to create new _headers, _redirects and netlify.toml files for Netlify or to use existing ones
TypeScript
50
star
71

imagemin-module

Automatically optimize (compress) all images used in Nuxt.js
TypeScript
50
star
72

nuxtent-template

Starter template for content heavy sites.
Vue
49
star
73

markdownit-module

Markdownit for Nuxt 2
JavaScript
48
star
74

lunr-module

Full-text search with pre-build indexes for Nuxt.js using lunr.js
JavaScript
47
star
75

mdx-module

MDX module for Nuxt 2
JavaScript
47
star
76

hapi-nuxt

Nuxt.js plugin for Hapi.js
JavaScript
46
star
77

supabase-module

Supabase module for Nuxt.
TypeScript
43
star
78

stylelint-module

Stylelint module for Nuxt.js
JavaScript
42
star
79

html-minifier-module

SSR HTML minification for Nuxt 2 (⚠️ experimental)
JavaScript
40
star
80

snipcart-module

Snipcart integration with for NuxtJS
JavaScript
32
star
81

component-cache-module

JavaScript
31
star
82

critters-module

CSS optimization using critters for Nuxt
JavaScript
30
star
83

dynamic-i18n

Synchronize automatically your translations from a specific provider
JavaScript
23
star
84

guess-module

Guess.js module for Nuxt 2
JavaScript
21
star
85

design-tokens-module

Design tokens module for Nuxt
TypeScript
20
star
86

applicationinsights-module

Application Insights module for Nuxt 2
JavaScript
18
star
87

observable-module

Nuxt.js module that injects a lightweight, Vue.observable()-based $state into the context
JavaScript
17
star
88

ackee-module

Nuxt 2 module for Ackee analytics
JavaScript
14
star
89

yandex-metrika-module

⚠️ Yandex Collects Your Personal Data! https://en.wikipedia.org/wiki/Yandex#Security
JavaScript
12
star
90

module-template-rollup

Starter template for Nuxt.js Modules with rollup
JavaScript
11
star
91

module-builder

πŸ—οΈ Nuxt Standard Module Builder (Depricated)
JavaScript
11
star
92

nuxt-helper-json

Vetur integration information for Nuxt.js
9
star
93

webpack-profile-module

Nuxt module to display webpack build progress steps with core ProgressPlugin
JavaScript
8
star
94

nuxt-event-trace

JavaScript
5
star
95

motd

Your source for Nuxt 2 tips
JavaScript
4
star
96

speedcurve-module

Speedcurve LUX integration for Nuxt 2
JavaScript
2
star
97

package-discovery

Package discovery automatically (⚠️ experimental)
JavaScript
2
star