@rendela/vite 0.0.11 → 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README.md +118 -89
  2. package/dist/README.md +118 -89
  3. package/package.json +5 -1
package/README.md CHANGED
@@ -1,115 +1,144 @@
1
- # Rendela - SPA Page Prerendering Plugin
1
+ # Rendela - Pre-rendering for Vite SPAs
2
2
 
3
- `Rendela` is a powerful tool designed to optimize Single Page Applications (SPAs) by prerendering them for better SEO, performance, and overall user experience. It helps search engines to index your pages more effectively, improves load times, and enhances the visibility of your site.
3
+ Rendela is an NPM library that allows you to pre-render selected pages of your Single Page Application to improve SEO, especially on landing pages that need to be indexed correctly by search engines.
4
4
 
5
- ## Key Features
6
- - **SEO Optimization:** Prerenders pages to ensure they are properly indexed by search engines.
7
- - **Faster Load Times:** By prerendering pages, users get content faster on their first visit.
8
- - **Easy Integration:** Easily integrates with your existing SPA built with frameworks like Vue, React, etc.
9
- - **Works with Vite:** This package works seamlessly with Vite to optimize SPA performance.
5
+ ## Features
10
6
 
11
- ## Prerequisites
12
-
13
- Before you start using `rendela`, you will need to install **Chromium** on your machine. This is required to properly prerender the pages as `rendela` uses Chromium in headless mode for rendering.
14
-
15
- ### Installation for Chromium
16
-
17
- #### On Ubuntu/Debian (Linux)
18
-
19
- 1. First, update your package list:
20
- ```bash
21
- sudo apt update
22
- ```
23
-
24
- 2. Then, install Chromium:
25
- ```bash
26
- sudo apt install chromium
27
- ```
28
-
29
- 3. Verify the installation by running:
30
- ```bash
31
- chromium --version
32
- ```
33
-
34
- This should show the installed Chromium version.
35
-
36
- #### On Windows
7
+ - Pre-renders selected pages of your SPA for improved SEO
8
+ - Seamless integration with Vite build process
9
+ - Configurable rendering options
10
+ - Support for Nginx and Apache server configurations
11
+ - Automatic Chromium handling
37
12
 
38
- 1. **Download Chromium**: You can download the latest stable version of Chromium from the [official website](https://download-chromium.appspot.com/).
39
-
40
- 2. **Extract the Archive**: Extract the downloaded `.zip` file to a location of your choice (e.g., `C:\Program Files\Chromium`).
41
-
42
- 3. **Set the Path**: You need to add the path to the Chromium executable in your system’s PATH environment variable.
43
- - Open **System Properties** > **Environment Variables**.
44
- - Under **System Variables**, find and select `Path`, then click **Edit**.
45
- - Click **New**, and add the path to the folder where Chromium is located (e.g., `C:\Program Files\Chromium`).
46
-
47
- 4. Verify the installation by running the following command in a terminal or command prompt:
48
- ```bash
49
- chromium --version
50
- ```
13
+ ## Prerequisites
51
14
 
52
- #### On macOS
15
+ Before installing Rendela, ensure you have:
53
16
 
54
- 1. **Install Chromium**: You can install Chromium using Homebrew. If you don't have Homebrew installed, first install it by running:
55
- ```bash
56
- /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
57
- ```
17
+ - A Vite-based project
18
+ - Node.js version 14 or higher
19
+ - Chrome or Chromium browser (required for headless rendering)
58
20
 
59
- 2. **Install Chromium** via Homebrew:
60
- ```bash
61
- brew install chromium
62
- ```
21
+ ### Installing Chromium
63
22
 
64
- 3. Verify the installation by running:
65
- ```bash
66
- chromium --version
67
- ```
23
+ **Linux:**
24
+ ```bash
25
+ apt update && apt install chromium
26
+ ```
68
27
 
69
- If you don't use Homebrew, you can manually download Chromium from the [official website](https://download-chromium.appspot.com/) and follow similar steps as for Windows.
28
+ **Windows:**
29
+ 1. Download Chromium from the [official website](https://www.chromium.org/getting-involved/download-chromium)
30
+ 2. Extract to desired location (e.g., `C:\Program Files\Chromium`)
31
+ 3. Add to PATH environment variable
70
32
 
71
- ---
33
+ **macOS:**
34
+ ```bash
35
+ # Install Homebrew if needed
36
+ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
37
+ # Install Chromium
38
+ brew install chromium
39
+ ```
72
40
 
73
41
  ## Installation
74
42
 
75
- Once Chromium is installed on your machine, you can proceed to install `rendela` as a Vite plugin.
43
+ Install Rendela in your Vite project:
44
+
45
+ ```bash
46
+ npm i @rendela/vite
47
+ ```
48
+
49
+ ## Configuration
50
+
51
+ 1. Add the plugin to your `vite.config.js` or `vite.config.ts`:
52
+
53
+ ```js
54
+ import { defineConfig } from 'vite';
55
+ import rendela from '@rendela/vite';
56
+
57
+ export default defineConfig({
58
+ plugins: [
59
+ rendela()
60
+ ]
61
+ });
62
+ ```
63
+
64
+ 2. Create a `rendela.config.js` in your project root (or let Rendela auto-generate it):
65
+
66
+ ```js
67
+ export default {
68
+ pages: [
69
+ { url: "/" },
70
+ { url: "/about" },
71
+ { url: "/products" }
72
+ ],
73
+ buildDir: "dist",
74
+ port: 3300,
75
+ savePath: "pages",
76
+ pageWaitTime: 10,
77
+ pageTimeout: 5000,
78
+ debug: true,
79
+ autoStartOnBuild: true,
80
+ concurrencyLimit: 1,
81
+ chromiumExecutablePath: undefined
82
+ };
83
+ ```
84
+
85
+ ### Configuration Options
86
+
87
+ | Parameter | Type | Default | Description |
88
+ |-----------|------|---------|-------------|
89
+ | pages | Array | `[{ url: '/' }]` | Pages to pre-render |
90
+ | buildDir | String | `"dist"` | Build directory |
91
+ | port | Number | `3300` | Server port for rendering |
92
+ | savePath | String | `"pages"` | Output directory for rendered pages |
93
+ | pageWaitTime | Number | `10` | Wait time after load (ms) |
94
+ | pageTimeout | Number | `5000` | Page load timeout (ms) |
95
+ | debug | Boolean | `true` | Enable debug logging |
96
+ | autoStartOnBuild | Boolean | `true` | Auto-render after build |
97
+ | concurrencyLimit | Number | `1` | Concurrent page limit |
98
+ | chromiumExecutablePath | String | `undefined` | Custom Chromium path |
76
99
 
77
- 1. Install the package via npm or yarn:
78
- ```bash
79
- npm install @rendela/vite
80
- # or
81
- yarn add @rendela/vite
82
- ```
100
+ ## Usage
83
101
 
84
- 2. Add `rendela` to your `vite.config.js`:
85
- ```javascript
86
- import { defineConfig } from 'vite'
87
- import rendela from '@rendela/vite'
102
+ With `autoStartOnBuild: true`, pages will be pre-rendered automatically after build. Otherwise, run:
88
103
 
89
- export default defineConfig({
90
- plugins: [rendela()],
91
- })
92
- ```
104
+ ```bash
105
+ npx rendela
106
+ ```
93
107
 
94
- ---
108
+ ## Server Configuration
95
109
 
96
- ## Usage
110
+ ### Nginx
97
111
 
98
- Once you've installed and configured `rendela` with Vite, it will automatically handle prerendering of your SPA pages when you build your project.
112
+ ```nginx
113
+ server {
114
+ listen 80;
115
+ root /var/www/your-site/dist;
116
+
117
+ location = / {
118
+ try_files /pages/index.html =404;
119
+ }
120
+
121
+ location / {
122
+ try_files $uri /pages/$uri/index.html /index.html =404;
123
+ }
124
+ }
125
+ ```
99
126
 
100
- ### How It Works
101
- - `rendela` will use the installed Chromium instance in headless mode to render and capture your pages.
102
- - It generates static HTML files of your pages that can be served to crawlers or users, ensuring better SEO and performance.
127
+ ### Apache
103
128
 
104
- ---
129
+ ```apache
130
+ <VirtualHost *:80>
131
+ DocumentRoot /var/www/your-site/dist
105
132
 
106
- ## Additional Notes
133
+ RewriteEngine On
134
+ RewriteCond %{REQUEST_URI} ^/$
135
+ RewriteRule ^$ /pages/index.html [L]
107
136
 
108
- - Make sure your Chromium installation is accessible from your system's PATH for `rendela` to function properly.
109
- - If you're running the plugin in a CI environment, make sure the Chromium binary is installed and available.
110
-
111
- ---
137
+ RewriteCond %{REQUEST_URI} !^/pages/
138
+ RewriteRule ^(.*)$ /pages/$1/index.html [L]
139
+ </VirtualHost>
140
+ ```
112
141
 
113
142
  ## License
114
143
 
115
- This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
144
+ MIT
package/dist/README.md CHANGED
@@ -1,115 +1,144 @@
1
- # Rendela - SPA Page Prerendering Plugin
1
+ # Rendela - Pre-rendering for Vite SPAs
2
2
 
3
- `Rendela` is a powerful tool designed to optimize Single Page Applications (SPAs) by prerendering them for better SEO, performance, and overall user experience. It helps search engines to index your pages more effectively, improves load times, and enhances the visibility of your site.
3
+ Rendela is an NPM library that allows you to pre-render selected pages of your Single Page Application to improve SEO, especially on landing pages that need to be indexed correctly by search engines.
4
4
 
5
- ## Key Features
6
- - **SEO Optimization:** Prerenders pages to ensure they are properly indexed by search engines.
7
- - **Faster Load Times:** By prerendering pages, users get content faster on their first visit.
8
- - **Easy Integration:** Easily integrates with your existing SPA built with frameworks like Vue, React, etc.
9
- - **Works with Vite:** This package works seamlessly with Vite to optimize SPA performance.
5
+ ## Features
10
6
 
11
- ## Prerequisites
12
-
13
- Before you start using `rendela`, you will need to install **Chromium** on your machine. This is required to properly prerender the pages as `rendela` uses Chromium in headless mode for rendering.
14
-
15
- ### Installation for Chromium
16
-
17
- #### On Ubuntu/Debian (Linux)
18
-
19
- 1. First, update your package list:
20
- ```bash
21
- sudo apt update
22
- ```
23
-
24
- 2. Then, install Chromium:
25
- ```bash
26
- sudo apt install chromium
27
- ```
28
-
29
- 3. Verify the installation by running:
30
- ```bash
31
- chromium --version
32
- ```
33
-
34
- This should show the installed Chromium version.
35
-
36
- #### On Windows
7
+ - Pre-renders selected pages of your SPA for improved SEO
8
+ - Seamless integration with Vite build process
9
+ - Configurable rendering options
10
+ - Support for Nginx and Apache server configurations
11
+ - Automatic Chromium handling
37
12
 
38
- 1. **Download Chromium**: You can download the latest stable version of Chromium from the [official website](https://download-chromium.appspot.com/).
39
-
40
- 2. **Extract the Archive**: Extract the downloaded `.zip` file to a location of your choice (e.g., `C:\Program Files\Chromium`).
41
-
42
- 3. **Set the Path**: You need to add the path to the Chromium executable in your system’s PATH environment variable.
43
- - Open **System Properties** > **Environment Variables**.
44
- - Under **System Variables**, find and select `Path`, then click **Edit**.
45
- - Click **New**, and add the path to the folder where Chromium is located (e.g., `C:\Program Files\Chromium`).
46
-
47
- 4. Verify the installation by running the following command in a terminal or command prompt:
48
- ```bash
49
- chromium --version
50
- ```
13
+ ## Prerequisites
51
14
 
52
- #### On macOS
15
+ Before installing Rendela, ensure you have:
53
16
 
54
- 1. **Install Chromium**: You can install Chromium using Homebrew. If you don't have Homebrew installed, first install it by running:
55
- ```bash
56
- /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
57
- ```
17
+ - A Vite-based project
18
+ - Node.js version 14 or higher
19
+ - Chrome or Chromium browser (required for headless rendering)
58
20
 
59
- 2. **Install Chromium** via Homebrew:
60
- ```bash
61
- brew install chromium
62
- ```
21
+ ### Installing Chromium
63
22
 
64
- 3. Verify the installation by running:
65
- ```bash
66
- chromium --version
67
- ```
23
+ **Linux:**
24
+ ```bash
25
+ apt update && apt install chromium
26
+ ```
68
27
 
69
- If you don't use Homebrew, you can manually download Chromium from the [official website](https://download-chromium.appspot.com/) and follow similar steps as for Windows.
28
+ **Windows:**
29
+ 1. Download Chromium from the [official website](https://www.chromium.org/getting-involved/download-chromium)
30
+ 2. Extract to desired location (e.g., `C:\Program Files\Chromium`)
31
+ 3. Add to PATH environment variable
70
32
 
71
- ---
33
+ **macOS:**
34
+ ```bash
35
+ # Install Homebrew if needed
36
+ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
37
+ # Install Chromium
38
+ brew install chromium
39
+ ```
72
40
 
73
41
  ## Installation
74
42
 
75
- Once Chromium is installed on your machine, you can proceed to install `rendela` as a Vite plugin.
43
+ Install Rendela in your Vite project:
44
+
45
+ ```bash
46
+ npm i @rendela/vite
47
+ ```
48
+
49
+ ## Configuration
50
+
51
+ 1. Add the plugin to your `vite.config.js` or `vite.config.ts`:
52
+
53
+ ```js
54
+ import { defineConfig } from 'vite';
55
+ import rendela from '@rendela/vite';
56
+
57
+ export default defineConfig({
58
+ plugins: [
59
+ rendela()
60
+ ]
61
+ });
62
+ ```
63
+
64
+ 2. Create a `rendela.config.js` in your project root (or let Rendela auto-generate it):
65
+
66
+ ```js
67
+ export default {
68
+ pages: [
69
+ { url: "/" },
70
+ { url: "/about" },
71
+ { url: "/products" }
72
+ ],
73
+ buildDir: "dist",
74
+ port: 3300,
75
+ savePath: "pages",
76
+ pageWaitTime: 10,
77
+ pageTimeout: 5000,
78
+ debug: true,
79
+ autoStartOnBuild: true,
80
+ concurrencyLimit: 1,
81
+ chromiumExecutablePath: undefined
82
+ };
83
+ ```
84
+
85
+ ### Configuration Options
86
+
87
+ | Parameter | Type | Default | Description |
88
+ |-----------|------|---------|-------------|
89
+ | pages | Array | `[{ url: '/' }]` | Pages to pre-render |
90
+ | buildDir | String | `"dist"` | Build directory |
91
+ | port | Number | `3300` | Server port for rendering |
92
+ | savePath | String | `"pages"` | Output directory for rendered pages |
93
+ | pageWaitTime | Number | `10` | Wait time after load (ms) |
94
+ | pageTimeout | Number | `5000` | Page load timeout (ms) |
95
+ | debug | Boolean | `true` | Enable debug logging |
96
+ | autoStartOnBuild | Boolean | `true` | Auto-render after build |
97
+ | concurrencyLimit | Number | `1` | Concurrent page limit |
98
+ | chromiumExecutablePath | String | `undefined` | Custom Chromium path |
76
99
 
77
- 1. Install the package via npm or yarn:
78
- ```bash
79
- npm install @rendela/vite
80
- # or
81
- yarn add @rendela/vite
82
- ```
100
+ ## Usage
83
101
 
84
- 2. Add `rendela` to your `vite.config.js`:
85
- ```javascript
86
- import { defineConfig } from 'vite'
87
- import rendela from '@rendela/vite'
102
+ With `autoStartOnBuild: true`, pages will be pre-rendered automatically after build. Otherwise, run:
88
103
 
89
- export default defineConfig({
90
- plugins: [rendela()],
91
- })
92
- ```
104
+ ```bash
105
+ npx rendela
106
+ ```
93
107
 
94
- ---
108
+ ## Server Configuration
95
109
 
96
- ## Usage
110
+ ### Nginx
97
111
 
98
- Once you've installed and configured `rendela` with Vite, it will automatically handle prerendering of your SPA pages when you build your project.
112
+ ```nginx
113
+ server {
114
+ listen 80;
115
+ root /var/www/your-site/dist;
116
+
117
+ location = / {
118
+ try_files /pages/index.html =404;
119
+ }
120
+
121
+ location / {
122
+ try_files $uri /pages/$uri/index.html /index.html =404;
123
+ }
124
+ }
125
+ ```
99
126
 
100
- ### How It Works
101
- - `rendela` will use the installed Chromium instance in headless mode to render and capture your pages.
102
- - It generates static HTML files of your pages that can be served to crawlers or users, ensuring better SEO and performance.
127
+ ### Apache
103
128
 
104
- ---
129
+ ```apache
130
+ <VirtualHost *:80>
131
+ DocumentRoot /var/www/your-site/dist
105
132
 
106
- ## Additional Notes
133
+ RewriteEngine On
134
+ RewriteCond %{REQUEST_URI} ^/$
135
+ RewriteRule ^$ /pages/index.html [L]
107
136
 
108
- - Make sure your Chromium installation is accessible from your system's PATH for `rendela` to function properly.
109
- - If you're running the plugin in a CI environment, make sure the Chromium binary is installed and available.
110
-
111
- ---
137
+ RewriteCond %{REQUEST_URI} !^/pages/
138
+ RewriteRule ^(.*)$ /pages/$1/index.html [L]
139
+ </VirtualHost>
140
+ ```
112
141
 
113
142
  ## License
114
143
 
115
- This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
144
+ MIT
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rendela/vite",
3
- "version": "0.0.11",
3
+ "version": "1.0.0",
4
4
  "description": "A tool for pre-rendering pages of your SPA to improve SEO and performance",
5
5
  "author": "llopary",
6
6
  "license": "MIT",
@@ -10,6 +10,10 @@
10
10
  "bin": {
11
11
  "rendela": "dist/cli.js"
12
12
  },
13
+ "repository": {
14
+ "type": "git",
15
+ "url": "git+https://github.com/rendela/vite"
16
+ },
13
17
  "files": [
14
18
  "dist"
15
19
  ],