[PR #44] [MERGED] Migrate Postwoman to Nuxt.js (full Vue and SCSS support) #2383

New issue

Closed

opened 2026-03-17 00:05:31 +03:00 by kerem · 0 comments

kerem commented

2026-03-17 00:05:31 +03:00

Owner

📋 Pull Request Information

Original PR: https://github.com/hoppscotch/hoppscotch/pull/44
Author: @NBTX
Created: 8/24/2019
Status: ✅ Merged
Merged: 8/24/2019
Merged by: @liyasthomas

Base: master ← Head: master

📝 Commits (4)

677bb04 🔧 Add gitignore entries for webstorm
a27be71 👽 Vue-ify Postwoman with Nuxt.js!
575f833 📝 Ensure 404.html is generated by Nuxt.
b7172da Fix PWA install button

📊 Changes

38 files changed (+12029 additions, -810 deletions)

View changed files

📝 .gitignore (+91 -1)
➖ 404.html (+0 -88)
📝 README.md (+23 -13)
➕ assets/README.md (+7 -0)
➕ assets/css/fonts.scss (+2 -0)
📝 assets/css/styles.scss (+11 -5)
➕ assets/js/pwa.js (+54 -0)
➕ components/README.md (+7 -0)
➖ index.html (+0 -319)
➕ jsconfig.json (+12 -0)
➕ layouts/README.md (+7 -0)
➕ layouts/default.vue (+62 -0)
➕ layouts/error.vue (+35 -0)
➖ manifest.json (+0 -41)
➕ middleware/README.md (+8 -0)
➕ nuxt.config.js (+138 -0)
➕ package-lock.json (+11139 -0)
📝 package.json (+19 -16)
➕ pages/README.md (+6 -0)
➕ pages/index.vue (+380 -0)

...and 18 more files

📄 Description

I have migrated Postwoman to Nuxt.js configured with static site mode.
In this PR, I've also updated the README to reflect these changes.

This PR solves https://github.com/liyasthomas/postwoman/issues/31.
I did not use https://github.com/chrisvfritz/vue-enterprise-boilerplate, as @diego81b proposed, because it would - as he said - need to be appropriately resized. Nuxt is, at least in my opinion, better in this respect as it is far more modular and allows us to just pick and choose modules we want.

Key changes are the styles.css file: => /assets/css/styles.scss (you'll also see fonts.scss that I created specifically for adding, importing and declaring font faces.)

All of the PWA code has been moved into a standalone file => /assets/js/pwa.js (which is used in /layouts/default.vue.)
The error page is now in /layouts/error.vue

The main application page is in /pages/index.vue - except for the header and footer, which is in /layouts/default.vue so it'll be added to every page.

Finally, the main application code has been moved from script.js to /pages/index.vue (I didn't really want to mess with the application JS itself all in one go.)

Quick footnote: Nuxt does have support for tailwind CSS but your CSS code is tidy and when it comes to design you really seem to know what you're doing! 😃
So I did not include the Tailwind module because I personally don't think it's necessary, however if you decide you would prefer to have the module, it's easy enough to add.

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/hoppscotch/hoppscotch/pull/44 **Author:** [@NBTX](https://github.com/NBTX) **Created:** 8/24/2019 **Status:** ✅ Merged **Merged:** 8/24/2019 **Merged by:** [@liyasthomas](https://github.com/liyasthomas) **Base:** `master` ← **Head:** `master` --- ### 📝 Commits (4) - [`677bb04`](https://github.com/hoppscotch/hoppscotch/commit/677bb041e9fdd5ddcfa02086cfe33b94a4a3292d) :wrench: Add gitignore entries for webstorm - [`a27be71`](https://github.com/hoppscotch/hoppscotch/commit/a27be71b13383420623c7726441691da182374d8) 👽 Vue-ify Postwoman with Nuxt.js! - [`575f833`](https://github.com/hoppscotch/hoppscotch/commit/575f8335d68aeed8401fa1db18943af0e8cdfc8d) 📝 Ensure 404.html is generated by Nuxt. - [`b7172da`](https://github.com/hoppscotch/hoppscotch/commit/b7172da20938a1d9a883efd585211531c368dbc1) Fix PWA install button ### 📊 Changes **38 files changed** (+12029 additions, -810 deletions) <details> <summary>View changed files</summary> 📝 `.gitignore` (+91 -1) ➖ `404.html` (+0 -88) 📝 `README.md` (+23 -13) ➕ `assets/README.md` (+7 -0) ➕ `assets/css/fonts.scss` (+2 -0) 📝 `assets/css/styles.scss` (+11 -5) ➕ `assets/js/pwa.js` (+54 -0) ➕ `components/README.md` (+7 -0) ➖ `index.html` (+0 -319) ➕ `jsconfig.json` (+12 -0) ➕ `layouts/README.md` (+7 -0) ➕ `layouts/default.vue` (+62 -0) ➕ `layouts/error.vue` (+35 -0) ➖ `manifest.json` (+0 -41) ➕ `middleware/README.md` (+8 -0) ➕ `nuxt.config.js` (+138 -0) ➕ `package-lock.json` (+11139 -0) 📝 `package.json` (+19 -16) ➕ `pages/README.md` (+6 -0) ➕ `pages/index.vue` (+380 -0) _...and 18 more files_ </details> ### 📄 Description I have migrated Postwoman to Nuxt.js configured with static site mode. In this PR, I've also updated the README to reflect these changes. This PR solves https://github.com/liyasthomas/postwoman/issues/31. I did not use https://github.com/chrisvfritz/vue-enterprise-boilerplate, as @diego81b proposed, because it would - as he said - need to be appropriately resized. Nuxt is, at least in my opinion, better in this respect as it is far more modular and allows us to just pick and choose modules we want. Key changes are the `styles.css` file: `=> /assets/css/styles.scss` (you'll also see `fonts.scss` that I created specifically for adding, importing and declaring font faces.) All of the PWA code has been moved into a standalone file => `/assets/js/pwa.js` (which is used in `/layouts/default.vue`.) The error page is now in `/layouts/error.vue` The main application page is in `/pages/index.vue` - except for the header and footer, which is in `/layouts/default.vue` so it'll be added to every page. Finally, the main application code has been moved from `script.js` to `/pages/index.vue` (I didn't really want to mess with the application JS itself all in one go.) --- Quick footnote: Nuxt does have support for tailwind CSS but your CSS code is tidy and when it comes to design you really seem to know what you're doing! 😃 So I did not include the Tailwind module because I personally don't think it's necessary, however if you decide you would prefer to have the module, it's easy enough to add. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>