From 6d059698a963e5a11ddfe4b23366749ff9676cb0 Mon Sep 17 00:00:00 2001
From: chiboreache <huyach@protonmail.ch>
Date: Tue, 19 Feb 2019 19:07:04 +0300
Subject: [PATCH] chore: add pug-stylus-coffee (#4927)

* add pug-stylus-coffee

* fix eslit

* fix eslint

* fix eslint #3
---
 .eslintignore                                 |   2 +-
 examples/pug-stylus-coffee/README.md          |  20 ++++++
 .../pug-stylus-coffee/components/Logo.vue     |  66 ++++++++++++++++++
 .../pug-stylus-coffee/components/README.md    |   7 ++
 examples/pug-stylus-coffee/layouts/README.md  |   7 ++
 .../pug-stylus-coffee/layouts/default.vue     |  46 ++++++++++++
 .../pug-stylus-coffee/middleware/README.md    |   8 +++
 .../pug-stylus-coffee/modules/coffeescript.js |  17 +++++
 examples/pug-stylus-coffee/nuxt.config.coffee |  48 +++++++++++++
 examples/pug-stylus-coffee/nuxt.config.js     |   2 +
 examples/pug-stylus-coffee/package.json       |  25 +++++++
 examples/pug-stylus-coffee/pages/README.md    |   7 ++
 examples/pug-stylus-coffee/pages/index.vue    |  55 +++++++++++++++
 examples/pug-stylus-coffee/plugins/README.md  |   7 ++
 examples/pug-stylus-coffee/static/README.md   |  10 +++
 examples/pug-stylus-coffee/static/favicon.ico | Bin 0 -> 1150 bytes
 examples/pug-stylus-coffee/store/README.md    |  10 +++
 examples/pug-stylus-coffee/store/index.coffee |   3 +
 18 files changed, 339 insertions(+), 1 deletion(-)
 create mode 100644 examples/pug-stylus-coffee/README.md
 create mode 100644 examples/pug-stylus-coffee/components/Logo.vue
 create mode 100644 examples/pug-stylus-coffee/components/README.md
 create mode 100644 examples/pug-stylus-coffee/layouts/README.md
 create mode 100644 examples/pug-stylus-coffee/layouts/default.vue
 create mode 100644 examples/pug-stylus-coffee/middleware/README.md
 create mode 100644 examples/pug-stylus-coffee/modules/coffeescript.js
 create mode 100644 examples/pug-stylus-coffee/nuxt.config.coffee
 create mode 100644 examples/pug-stylus-coffee/nuxt.config.js
 create mode 100644 examples/pug-stylus-coffee/package.json
 create mode 100644 examples/pug-stylus-coffee/pages/README.md
 create mode 100644 examples/pug-stylus-coffee/pages/index.vue
 create mode 100644 examples/pug-stylus-coffee/plugins/README.md
 create mode 100644 examples/pug-stylus-coffee/static/README.md
 create mode 100644 examples/pug-stylus-coffee/static/favicon.ico
 create mode 100644 examples/pug-stylus-coffee/store/README.md
 create mode 100644 examples/pug-stylus-coffee/store/index.coffee

diff --git a/.eslintignore b/.eslintignore
index 48de14efb0..8e3846f0c8 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -8,7 +8,7 @@ coverage
 
 ## cofeescript
 examples/coffeescript/pages/index.vue
-
+examples/pug-stylus-coffee/
 # Packages
 
 # vue-app
diff --git a/examples/pug-stylus-coffee/README.md b/examples/pug-stylus-coffee/README.md
new file mode 100644
index 0000000000..930f5e4d87
--- /dev/null
+++ b/examples/pug-stylus-coffee/README.md
@@ -0,0 +1,20 @@
+# Pug + Stylus + Coffee template for Nuxt.js
+
+> Ultimative complete pack for coding with pleasure and Nuxt.js
+
+## Build Setup
+
+``` bash
+# install dependencies
+$ npm install
+
+# serve with hot reload at localhost:3000
+$ npm run dev
+
+# build for production and launch server
+$ npm run build
+$ npm start
+
+# generate static project
+$ npm run generate
+```
diff --git a/examples/pug-stylus-coffee/components/Logo.vue b/examples/pug-stylus-coffee/components/Logo.vue
new file mode 100644
index 0000000000..14799f76d3
--- /dev/null
+++ b/examples/pug-stylus-coffee/components/Logo.vue
@@ -0,0 +1,66 @@
+<template lang="pug">
+  .VueToNuxtLogo
+    .Triangle.Triangle--two
+    .Triangle.Triangle--one
+    .Triangle.Triangle--three
+    .Triangle.Triangle--four
+</template>
+
+<style lang="stylus">
+.VueToNuxtLogo
+  display: inline-block
+  animation: turn 2s linear forwards 1s
+  transform: rotateX(180deg)
+  position: relative
+  overflow: hidden
+  height: 180px
+  width: 245px
+
+.Triangle
+  position: absolute
+  top: 0
+  left: 0
+  width: 0
+  height: 0
+
+.Triangle--one
+  border-left: 105px solid transparent
+  border-right: 105px solid transparent
+  border-bottom: 180px solid #41b883
+
+.Triangle--two
+  top: 30px
+  left: 35px
+  animation: goright 0.5s linear forwards 3.5s
+  border-left: 87.5px solid transparent
+  border-right: 87.5px solid transparent
+  border-bottom: 150px solid #3b8070
+
+.Triangle--three
+  top: 60px
+  left: 35px
+  animation: goright 0.5s linear forwards 3.5s
+  border-left: 70px solid transparent
+  border-right: 70px solid transparent
+  border-bottom: 120px solid #35495e
+
+.Triangle--four
+  top: 120px
+  left: 70px
+  animation: godown 0.5s linear forwards 3s
+  border-left: 35px solid transparent
+  border-right: 35px solid transparent
+  border-bottom: 60px solid #fff
+
+@keyframes turn
+  100%
+    transform: rotateX(0deg)
+
+@keyframes godown
+  100%
+    top: 180px
+
+@keyframes goright
+  100%
+    left: 70px
+</style>
diff --git a/examples/pug-stylus-coffee/components/README.md b/examples/pug-stylus-coffee/components/README.md
new file mode 100644
index 0000000000..a079f1060e
--- /dev/null
+++ b/examples/pug-stylus-coffee/components/README.md
@@ -0,0 +1,7 @@
+# COMPONENTS
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+The components directory contains your Vue.js Components.
+
+_Nuxt.js doesn't supercharge these components._
diff --git a/examples/pug-stylus-coffee/layouts/README.md b/examples/pug-stylus-coffee/layouts/README.md
new file mode 100644
index 0000000000..cad1ad5738
--- /dev/null
+++ b/examples/pug-stylus-coffee/layouts/README.md
@@ -0,0 +1,7 @@
+# LAYOUTS
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your Application Layouts.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/views#layouts).
diff --git a/examples/pug-stylus-coffee/layouts/default.vue b/examples/pug-stylus-coffee/layouts/default.vue
new file mode 100644
index 0000000000..540fff86da
--- /dev/null
+++ b/examples/pug-stylus-coffee/layouts/default.vue
@@ -0,0 +1,46 @@
+<template lang="pug">
+  .div
+    nuxt
+</template>
+
+<style lang="stylus">
+html
+  font-family: 'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI',
+    Roboto, 'Helvetica Neue', Arial, sans-serif
+  font-size: 16px
+  word-spacing: 1px
+  -ms-text-size-adjust: 100%
+  -webkit-text-size-adjust: 100%
+  -moz-osx-font-smoothing: grayscale
+  -webkit-font-smoothing: antialiased
+  box-sizing: border-box
+
+*
+&:before
+&:after
+  box-sizing: border-box
+  margin: 0
+
+.button--green
+  display: inline-block
+  border-radius: 4px
+  border: 1px solid #3b8070
+  color: #3b8070
+  text-decoration: none
+  padding: 10px 30px
+  &:hover
+    color: #fff
+    background-color: #3b8070
+
+.button--grey
+  display: inline-block
+  border-radius: 4px
+  border: 1px solid #35495e
+  color: #35495e
+  text-decoration: none
+  padding: 10px 30px
+  margin-left: 15px
+  &:hover
+    color: #fff
+    background-color: #35495e
+</style>
diff --git a/examples/pug-stylus-coffee/middleware/README.md b/examples/pug-stylus-coffee/middleware/README.md
new file mode 100644
index 0000000000..01595ded74
--- /dev/null
+++ b/examples/pug-stylus-coffee/middleware/README.md
@@ -0,0 +1,8 @@
+# MIDDLEWARE
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your application middleware.
+Middleware let you define custom functions that can be run before rendering either a page or a group of pages.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/routing#middleware).
diff --git a/examples/pug-stylus-coffee/modules/coffeescript.js b/examples/pug-stylus-coffee/modules/coffeescript.js
new file mode 100644
index 0000000000..b8ccfc05d5
--- /dev/null
+++ b/examples/pug-stylus-coffee/modules/coffeescript.js
@@ -0,0 +1,17 @@
+export default function () {
+  // Add .coffee extension for store, middleware and more
+  this.nuxt.options.extensions.push('coffee')
+  // Extend build
+  const coffeeLoader = {
+    test: /\.coffee$/,
+    loader: 'coffee-loader'
+  }
+  this.extendBuild((config) => {
+    // Add CoffeeScruot loader
+    config.module.rules.push(coffeeLoader)
+    // Add .coffee extension in webpack resolve
+    if (config.resolve.extensions.indexOf('.coffee') === -1) {
+      config.resolve.extensions.push('.coffee')
+    }
+  })
+}
diff --git a/examples/pug-stylus-coffee/nuxt.config.coffee b/examples/pug-stylus-coffee/nuxt.config.coffee
new file mode 100644
index 0000000000..039a2022ba
--- /dev/null
+++ b/examples/pug-stylus-coffee/nuxt.config.coffee
@@ -0,0 +1,48 @@
+pkg = require('./package')
+module.exports =
+  mode: 'universal'
+  #
+  # Headers of the page
+  #
+  head:
+    title: pkg.name
+    meta:
+      [
+        {
+          charset: 'utf-8'
+        }
+        {
+          name: 'viewport'
+          content: 'width=device-width, initial-scale=1'
+        }
+        {
+          hid: 'description'
+          name: 'description'
+          content: pkg.description
+        }
+      ]
+    link:
+      [
+        rel: 'icon'
+        type: 'image/x-icon'
+        href: '/favicon.ico'
+      ]
+  # Customize the progress-bar color
+  loading:
+    {
+      color: '#3B8070'
+    }
+  # Global CSS
+  css: []
+  # Plugins to load before mounting the App
+  plugins: []
+  # Nuxt.js modules
+  modules:
+    [
+      '~/modules/coffeescript'
+    ]
+  # Build configuration
+  build:
+    # You can extend webpack config here
+    extend = (config, ctx) ->
+      pass
diff --git a/examples/pug-stylus-coffee/nuxt.config.js b/examples/pug-stylus-coffee/nuxt.config.js
new file mode 100644
index 0000000000..3d783db4d2
--- /dev/null
+++ b/examples/pug-stylus-coffee/nuxt.config.js
@@ -0,0 +1,2 @@
+require('coffeescript/register')
+module.exports = require('./nuxt.config.coffee')
diff --git a/examples/pug-stylus-coffee/package.json b/examples/pug-stylus-coffee/package.json
new file mode 100644
index 0000000000..c63df436f8
--- /dev/null
+++ b/examples/pug-stylus-coffee/package.json
@@ -0,0 +1,25 @@
+{
+  "name": "example-pug-stylus-coffee",
+  "version": "1.0.0",
+  "description": "Nuxt.js with Pug Stylus and CoffeeScript",
+  "author": "Alex Ananiev <alex.ananiev.r@gmail.com>, Kron Austrum <huyach@protonmail.ch>",
+  "private": true,
+  "scripts": {
+    "dev": "nuxt",
+    "build": "nuxt build",
+    "start": "nuxt start",
+    "generate": "nuxt generate",
+    "post-update": "yarn upgrade --latest"
+  },
+  "dependencies": {
+    "nuxt": "latest"
+  },
+  "devDependencies": {
+    "coffee-loader": "^0.8.0",
+    "coffeescript": "^2.0.1",
+    "pug": "^2.0.3",
+    "pug-plain-loader": "^1.0.0",
+    "stylus": "^0.54.5",
+    "stylus-loader": "^3.0.2"
+  }
+}
diff --git a/examples/pug-stylus-coffee/pages/README.md b/examples/pug-stylus-coffee/pages/README.md
new file mode 100644
index 0000000000..3c7faf56e7
--- /dev/null
+++ b/examples/pug-stylus-coffee/pages/README.md
@@ -0,0 +1,7 @@
+# PAGES
+
+This directory contains your Application Views and Routes.
+The framework reads all the .vue files inside this directory and create the router of your application.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/routing
diff --git a/examples/pug-stylus-coffee/pages/index.vue b/examples/pug-stylus-coffee/pages/index.vue
new file mode 100644
index 0000000000..ee0df7e4ef
--- /dev/null
+++ b/examples/pug-stylus-coffee/pages/index.vue
@@ -0,0 +1,55 @@
+<template lang="pug">
+  section.container
+    div
+      logo
+      h1.title Nuxt.js with Pug Stylus and Coffee!
+      h2.subtitle {{ $store.state.msg }}
+      //- h2.subtitle {{message}}
+      .links
+        a.button--green(
+          href='https://nuxtjs.org/'
+          arget='_blank') Documentation
+        a.button--grey(
+          href='https://github.com/nuxt/nuxt.js'
+          target='_blank') GitHub
+</template>
+
+
+<script lang="coffee">
+import Logo from '~/components/Logo.vue'
+
+export default
+  components: { Logo }
+  computed:
+    message: -> @$store.state.msgComputed
+</script>
+
+<style lang="stylus">
+.container
+  margin: 0 auto
+  min-height: 100vh
+  display: flex
+  justify-content: center
+  align-items: center
+  text-align: center
+
+.title
+  font-family: 'Quicksand', 'Source Sans Pro', -apple-system, BlinkMacSystemFont,
+    'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif
+  display: block
+  font-weight: 300
+  font-size: 60px
+  color: #35495e
+  letter-spacing: 1px
+  padding 5%
+
+.subtitle
+  font-weight: 300
+  font-size: 42px
+  color: #526488
+  word-spacing: 5px
+  padding-bottom: 15px
+
+.links
+  padding-top: 15px
+</style>
diff --git a/examples/pug-stylus-coffee/plugins/README.md b/examples/pug-stylus-coffee/plugins/README.md
new file mode 100644
index 0000000000..ca1f9d8a45
--- /dev/null
+++ b/examples/pug-stylus-coffee/plugins/README.md
@@ -0,0 +1,7 @@
+# PLUGINS
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains Javascript plugins that you want to run before mounting the root Vue.js application.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/plugins).
diff --git a/examples/pug-stylus-coffee/static/README.md b/examples/pug-stylus-coffee/static/README.md
new file mode 100644
index 0000000000..3fc5002348
--- /dev/null
+++ b/examples/pug-stylus-coffee/static/README.md
@@ -0,0 +1,10 @@
+# STATIC
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your static files.
+Each file inside this directory is mapped to `/`.
+
+Example: `/static/robots.txt` is mapped as `/robots.txt`.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#static).
diff --git a/examples/pug-stylus-coffee/static/favicon.ico b/examples/pug-stylus-coffee/static/favicon.ico
new file mode 100644
index 0000000000000000000000000000000000000000..c785410aa253440c16be3c4153584815449ef1fb
GIT binary patch
literal 1150
zcmd5(Pe>GD6#uQ8iV-=ZwUidsK@&EZ(IrAUb&A<p39JY*c6Kecf(Q|2wy;B;X0&B@
zF^f8chv?#|TbD#Mc6Rp?L@8dhu=UU_@X|rpeqZ*%CMzDg^bNmx?|bk4-oFnB@KY4<
ze;l{=03iT91WmMT*(v_Zll5^sTR@R0OQaIvg}9-W>%lU$(#ZYJdD~UWj;l`Rd^{nh
zvPGN}$SeeV;!$laVfJ1~#PqIOBnSGsnRD^RQ246jwOzD5<zv2tL#$iL`#2~UWJUFB
zjC(8ZQd*{d#WJ*6akpJ{Ha*@J6MC+IG0yQ!=;EYOkpTH6);6{*z_59`g|-#u)>wPM
z_SD~bg#W3J7S6Crgk`)H)%qE~bp3LFqp)$Nv3OK}@i2R&k#jE+y)stFToFU;<FB5X
z<2CEuwPKMD=2}l0eIdtF?{Ih1wOpakRS^*TXP)!Y$NrC!SK-dz#0}j}dx}Et*LxG8
zP8m}x^F^HH9zMNXMo`*^FP+K|8>zualj9wjApeo{)sviIhPWwxnYrM*(FYyh9q!t3
zl`rgJpY+v}lLegM9BY#$?B|=B)ZeFFb&z#8IeW4mXS<CvjFb16eSD^VM)=cS`?2kD
zJKed%R`S=$eYI1}ZuY4%_Rjcd*e&i~{naWUAkX0n@O&P~oC7}a6@B7cGq6GYXa#;+
K1midV@O}YTTE@!&

literal 0
HcmV?d00001

diff --git a/examples/pug-stylus-coffee/store/README.md b/examples/pug-stylus-coffee/store/README.md
new file mode 100644
index 0000000000..1972d277a2
--- /dev/null
+++ b/examples/pug-stylus-coffee/store/README.md
@@ -0,0 +1,10 @@
+# STORE
+
+**This directory is not required, you can delete it if you don't want to use it.**
+
+This directory contains your Vuex Store files.
+Vuex Store option is implemented in the Nuxt.js framework.
+
+Creating a file in this directory automatically activates the option in the framework.
+
+More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/vuex-store).
diff --git a/examples/pug-stylus-coffee/store/index.coffee b/examples/pug-stylus-coffee/store/index.coffee
new file mode 100644
index 0000000000..5b8fb88be6
--- /dev/null
+++ b/examples/pug-stylus-coffee/store/index.coffee
@@ -0,0 +1,3 @@
+export state = ->
+  msg: 'Hello from /store/index.coffee!'
+  msgComputed: 'Hello from /store/index.coffee computed!'