Skip to content

Commit c6aee48

Browse files
mentAl-maZementAl-maZe
committed
feat(sw-cache): implement sw-cache extension
1 parent 36b9147 commit c6aee48

14 files changed

+3364
-1220
lines changed

‎README-template.md

+36-7
Original file line numberDiff line numberDiff line change
@@ -17,12 +17,12 @@ Looking for the old CLI extension? [nuxt-laravel](https://github.com/m2sd/nuxt-l
1717
This module makes it easy to integrate a [NuxtJS](https://nuxtjs.org) SPA into a [Laravel](https://laravel.com) application.
1818
The implementation is based on [laravel-nuxt-js](https://github.com/skyrpex/laravel-nuxt-js) by [skyrpex](https://github.com/skyrpex).
1919

20-
> **Hint:** Use his composer exension [laravel-nuxt](https://github.com/skyrpex/laravel-nuxt) if you want to forward multiple specific routes to nuxt.
20+
> **Hint:** Use his composer extension [laravel-nuxt](https://github.com/skyrpex/laravel-nuxt) if you want to forward multiple specific routes to nuxt.
2121
2222
## Features
2323

24-
* Easyly deploy an existing Nuxt app inside a Laravel application or vice versa
25-
* Test your Nuxt app with live reloading, HMR and the autoconfigured Laravel test server
24+
* Easily deploy an existing Nuxt app inside a Laravel application or vice versa
25+
* Test your Nuxt app with live reloading, HMR and the auto-configured Laravel test server
2626
* Seamlessly integrate Nuxt into the URL resolution of Laravel
2727
* Share cookies and session state between frontend (Nuxt) and backend (Laravel) without the need for an API token
2828

@@ -38,6 +38,12 @@ Install this package and its peer dependencies.
3838
npm install --save-dev @nuxtjs/axios @nuxtjs/proxy nuxt-laravel@next
3939
```
4040

41+
or
42+
43+
```bash
44+
yarn add --dev @nuxtjs/axios @nuxtjs/proxy nuxt-laravel@next
45+
```
46+
4147
### Configuration
4248

4349
Simply include `nuxt-laravel` in `modules` and set the `mode` setting to `'spa'` in your `nuxt.config.js`
@@ -77,20 +83,43 @@ export default {
7783
| `publicDir` | `string` | The folder where laravel serves assets from (is resolved relative to `root`) | `'public'` |
7884
| `outputPath` | `string` | File location to which an additional index route will be rendered, useful if you want to store it in a folder outside of Laravels public dir (is resolved relative to `root`) | `null` |
7985
| `server` | `boolean` or `object` | Settings for the Laravel testserver | *(see below)* |
86+
| `swCache` | `boolean` or `object` | Settings for a cache endpoint workbox extensions using `@nuxtjs/pwa` | *(see below)* |
8087
| `dotEnvExport` | `boolean` | Whether the `NUXT_OUTPUT_PATH` varibale should be written to the `.env` file in the laravel root directory | `false` |
8188

82-
The module loads the `.env` file from yout laravel root, so you can set the `NUXT_OUTPUT_PATH` environment variable from there.
89+
The module loads the `.env` file from your laravel root, so you can set the `NUXT_OUTPUT_PATH` environment variable from there.
8390

8491
#### The `server` setting
8592

8693
If this setting is set to `false` the module will be disabled for development.
87-
Setting this to `true` is equivalient to omitting it and will simply use the default configuration.
94+
Setting this to `true` is equivalent to omitting it and will simply use the default configuration.
8895

8996
| option | type | description | default |
9097
| ------ | -------- | --------------------------- | ---------------------------- |
9198
| `host` | `string` | Hostname for the testserver | `nuxtConfig.server.host` |
9299
| `port` | `number` | Port for the testserver | `nuxtConfig.server.port + 1` |
93100

101+
#### The `swCache` setting
102+
103+
To use this setting you have to install the optional dependency `@nuxtjs/pwa`.
104+
105+
```bash
106+
npm install --save-dev @nuxtjs/pwa
107+
```
108+
109+
or
110+
111+
```bash
112+
yarn add --dev @nuxtjs/pwa
113+
```
114+
115+
If this setting is set to `true` the caching endpoint will be added with the default configuration.
116+
117+
| option | type | description | default |
118+
| ---------- | -------- | ----------------------------------------------------------------------------------------- | ------------------------- |
119+
| `name` | `string` | The name for the cache to which values are written | `'__nuxt_laravel'` |
120+
| `fileName` | `string` | The name for the file generated in the nuxt buildDir | `'workbox.cache.js'` |
121+
| `endpoint` | `string` | The endpoint to which values can be `post`ed/from which values can be gotten (`get`) from | `'/__nuxt_laravel_cache'` |
122+
94123
#### Path resolution inside `publicDir`
95124

96125
If `nuxtConfig.router.base` is not set the SPA will be generated in the `publicDir` root with an index file name of `spa.html`.
@@ -183,7 +212,7 @@ Laravel integration is accomplished through two environment variables.
183212
// ...
184213
// Add this route last as a catch all for undefined routes.
185214
Route::get(
186-
'{path}',
215+
'{path?}',
187216
function($request) {
188217
// ...
189218
// If the request expects JSON, it means that
@@ -277,7 +306,7 @@ Route::get(
277306
* `<nuxtRoot>/pages/subpage/<path>/index.vue`
278307
*/
279308
Route::get(
280-
'app/subpage{path}',
309+
'app/subpage{path?}',
281310
'\\'.Pallares\LaravelNuxt\Controllers\NuxtController::class
282311
)->where('path', '.*')
283312
// Redirect to a spcific subpage/<path> from within Laravel

‎README.md

+36-7
Original file line numberDiff line numberDiff line change
@@ -17,12 +17,12 @@ Looking for the old CLI extension? [nuxt-laravel](https://github.com/m2sd/nuxt-l
1717
This module makes it easy to integrate a [NuxtJS](https://nuxtjs.org) SPA into a [Laravel](https://laravel.com) application.
1818
The implementation is based on [laravel-nuxt-js](https://github.com/skyrpex/laravel-nuxt-js) by [skyrpex](https://github.com/skyrpex).
1919

20-
> **Hint:** Use his composer exension [laravel-nuxt](https://github.com/skyrpex/laravel-nuxt) if you want to forward multiple specific routes to nuxt.
20+
> **Hint:** Use his composer extension [laravel-nuxt](https://github.com/skyrpex/laravel-nuxt) if you want to forward multiple specific routes to nuxt.
2121
2222
## Features
2323

24-
* Easyly deploy an existing Nuxt app inside a Laravel application or vice versa
25-
* Test your Nuxt app with live reloading, HMR and the autoconfigured Laravel test server
24+
* Easily deploy an existing Nuxt app inside a Laravel application or vice versa
25+
* Test your Nuxt app with live reloading, HMR and the auto-configured Laravel test server
2626
* Seamlessly integrate Nuxt into the URL resolution of Laravel
2727
* Share cookies and session state between frontend (Nuxt) and backend (Laravel) without the need for an API token
2828

@@ -38,6 +38,12 @@ Install this package and its peer dependencies.
3838
npm install --save-dev @nuxtjs/axios @nuxtjs/proxy nuxt-laravel@next
3939
```
4040

41+
or
42+
43+
```bash
44+
yarn add --dev @nuxtjs/axios @nuxtjs/proxy nuxt-laravel@next
45+
```
46+
4147
### Configuration
4248

4349
Simply include `nuxt-laravel` in `modules` and set the `mode` setting to `'spa'` in your `nuxt.config.js`
@@ -77,20 +83,43 @@ export default {
7783
| `publicDir` | `string` | The folder where laravel serves assets from (is resolved relative to `root`) | `'public'` |
7884
| `outputPath` | `string` | File location to which an additional index route will be rendered, useful if you want to store it in a folder outside of Laravels public dir (is resolved relative to `root`) | `null` |
7985
| `server` | `boolean` or `object` | Settings for the Laravel testserver | *(see below)* |
86+
| `swCache` | `boolean` or `object` | Settings for a cache endpoint workbox extensions using `@nuxtjs/pwa` | *(see below)* |
8087
| `dotEnvExport` | `boolean` | Whether the `NUXT_OUTPUT_PATH` varibale should be written to the `.env` file in the laravel root directory | `false` |
8188

82-
The module loads the `.env` file from yout laravel root, so you can set the `NUXT_OUTPUT_PATH` environment variable from there.
89+
The module loads the `.env` file from your laravel root, so you can set the `NUXT_OUTPUT_PATH` environment variable from there.
8390

8491
#### The `server` setting
8592

8693
If this setting is set to `false` the module will be disabled for development.
87-
Setting this to `true` is equivalient to omitting it and will simply use the default configuration.
94+
Setting this to `true` is equivalent to omitting it and will simply use the default configuration.
8895

8996
| option | type | description | default |
9097
| ------ | -------- | --------------------------- | ---------------------------- |
9198
| `host` | `string` | Hostname for the testserver | `nuxtConfig.server.host` |
9299
| `port` | `number` | Port for the testserver | `nuxtConfig.server.port + 1` |
93100

101+
#### The `swCache` setting
102+
103+
To use this setting you have to install the optional dependency `@nuxtjs/pwa`.
104+
105+
```bash
106+
npm install --save-dev @nuxtjs/pwa
107+
```
108+
109+
or
110+
111+
```bash
112+
yarn add --dev @nuxtjs/pwa
113+
```
114+
115+
If this setting is set to `true` the caching endpoint will be added with the default configuration.
116+
117+
| option | type | description | default |
118+
| ---------- | -------- | ----------------------------------------------------------------------------------------- | ------------------------- |
119+
| `name` | `string` | The name for the cache to which values are written | `'__nuxt_laravel'` |
120+
| `fileName` | `string` | The name for the file generated in the nuxt buildDir | `'workbox.cache.js'` |
121+
| `endpoint` | `string` | The endpoint to which values can be `post`ed/from which values can be gotten (`get`) from | `'/__nuxt_laravel_cache'` |
122+
94123
#### Path resolution inside `publicDir`
95124

96125
If `nuxtConfig.router.base` is not set the SPA will be generated in the `publicDir` root with an index file name of `spa.html`.
@@ -183,7 +212,7 @@ Laravel integration is accomplished through two environment variables.
183212
// ...
184213
// Add this route last as a catch all for undefined routes.
185214
Route::get(
186-
'{path}',
215+
'{path?}',
187216
function($request) {
188217
// ...
189218
// If the request expects JSON, it means that
@@ -277,7 +306,7 @@ Route::get(
277306
* `<nuxtRoot>/pages/subpage/<path>/index.vue`
278307
*/
279308
Route::get(
280-
'app/subpage{path}',
309+
'app/subpage{path?}',
281310
'\\'.Pallares\LaravelNuxt\Controllers\NuxtController::class
282311
)->where('path', '.*')
283312
// Redirect to a spcific subpage/<path> from within Laravel

‎lib/module.js

+20-7
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,6 @@ const utils_1 = require("./utils");
1313
const options_1 = require("./options");
1414
const laravelModule = function (overwrites) {
1515
const config = options_1.getConfiguration(this.options, overwrites);
16-
/** CONFIGURATION **/
17-
// cli helper
1816
/** VALIDATION **/
1917
// Fail with a warning if we are not in 'spa' mode
2018
if (this.options.mode !== 'spa') {
@@ -34,6 +32,23 @@ const laravelModule = function (overwrites) {
3432
return;
3533
}
3634
/** IMPLEMENTATION **/
35+
// Optional cache module
36+
if (config.cache) {
37+
const pwa = utils_1.getModuleOptions(this.options, '@nuxtjs/pwa');
38+
const routingExtensions = (pwa && pwa.workbox && pwa.workbox.routingExtensions) || null;
39+
const { dst } = this.addTemplate({
40+
src: path_1.default.join(__dirname, 'templates', 'workbox.cache.ejs'),
41+
options: config.cache,
42+
fileName: config.cache.fileName
43+
});
44+
this.options.pwa = Object.assign({}, pwa, { workbox: Object.assign({}, (pwa && pwa.workbox), { routingExtensions: [
45+
...(typeof routingExtensions === 'string'
46+
? [routingExtensions]
47+
: routingExtensions),
48+
path_1.default.join(this.options.buildDir, dst)
49+
] }) });
50+
this.requireModule('@nuxtjs/pwa');
51+
}
3752
// DEV behavior
3853
if (this.options.dev) {
3954
// Fail with warning if server is not configured
@@ -70,11 +85,9 @@ const laravelModule = function (overwrites) {
7085
// If we were unable to resolve the index route,
7186
// but modules are present
7287
if (!index && this.options.modules) {
73-
// we check for nuxt-i18n module
74-
const i18nModuleOptions = this.options.modules.find(m => (Array.isArray(m) && m[0] === 'nuxt-i18n') || m === 'nuxt-i18n');
75-
const i18nOptions = Object.assign({}, i18nModuleOptions, this.options.i18n);
88+
const i18nOptions = utils_1.getModuleOptions(this.options, 'nuxt-i18n');
7689
// if i18n module is present, we try to find the translated index route
77-
if (i18nOptions.defaultLocale) {
90+
if (i18nOptions && i18nOptions.defaultLocale) {
7891
const separator = i18nOptions.routesNameSeparator || '___';
7992
index = routes.find(route => !!(route.name &&
8093
route.name.match(new RegExp(`^index${separator}${i18nOptions.defaultLocale}`))));
@@ -150,7 +163,6 @@ const laravelModule = function (overwrites) {
150163
if (!this.options.dev) {
151164
// configure generation
152165
this.options.generate = Object.assign({}, (this.options.generate || {}), { dir: config.output.src, exclude: [/.*/], fallback: config.output.fallback });
153-
utils_1.logger.info('Generation configured for Laravel SPA.');
154166
this.nuxt.hook('generate:done', async ({ nuxt }) => {
155167
// generate assets
156168
utils_1.logger.info('Generating SPA assets...');
@@ -201,6 +213,7 @@ const laravelModule = function (overwrites) {
201213
: envInput.concat(envOutput));
202214
}
203215
});
216+
utils_1.logger.info('Generation configured for Laravel SPA.');
204217
}
205218
};
206219
exports.default = laravelModule;

‎lib/options.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ exports.getConfiguration = (nuxtOptions, overwrites) => {
4646
const cache = (() => {
4747
const defaults = {
4848
name: constants_1.moduleKey,
49-
fielName: 'sw-cache.js',
49+
fileName: 'workbox.cache.js',
5050
endpoint: `/${constants_1.moduleKey}_cache`
5151
};
5252
if (typeof options.swCache === 'boolean') {

‎src/templates/sw-cache.ejs ‎lib/templates/workbox.cache.ejs

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
const CACHE_NAME = '<%= name %>'
2-
const TOKEN_ENDPOINT = '<%= endpoint %>'
1+
const CACHE_NAME = '<%= options.name %>'
2+
const TOKEN_ENDPOINT = '<%= options.endpoint %>'
33

44
workbox.routing.registerRoute(
55
TOKEN_ENDPOINT,

‎lib/utils.js

+13
Original file line numberDiff line numberDiff line change
@@ -13,3 +13,16 @@ exports.addBadgeMessage = (options, enabled = true) => {
1313
: chalk_1.default.red.bold('disabled');
1414
options.cli.badgeMessages.push(`Laravel support is ${status}`);
1515
};
16+
exports.getModuleOptions = (options, moduleKey, optionsKey) => {
17+
if (options.modules) {
18+
const nuxtModule = options.modules.find(m => (Array.isArray(m) && m[0] === moduleKey) || m === moduleKey);
19+
if (nuxtModule) {
20+
const optKey = optionsKey || moduleKey.split(/[-/]/).pop();
21+
const moduleOptions = Object.assign({}, (Array.isArray(nuxtModule) && nuxtModule[1]) || {}, optKey ? options[optKey] : {});
22+
if (Object.keys(moduleOptions).length) {
23+
return moduleOptions;
24+
}
25+
}
26+
}
27+
return null;
28+
};

0 commit comments

Comments
 (0)