@nzz/q-cli 1.5.4 → 1.5.5

package/skeletons/custom-code-skeleton/package.json

@@ -3,20 +3,23 @@
   "version": "1.0.0",
   "devDependencies": {
     "@nzz/q-cli": "^1.4.11",
-    "@rollup/plugin-buble": "^0.21.3",
-    "@rollup/plugin-commonjs": "^17.1.0",
-    "@rollup/plugin-html": "^0.2.3",
+    "@rollup/plugin-commonjs": "^21.0.0",
+    "@rollup/plugin-html": "^0.2.4",
     "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-node-resolve": "^11.2.1",
+    "@rollup/plugin-node-resolve": "^13.0.5",
+    "autoprefixer": "^10.4.0",
+    "cssnano": "^5.0.10",
     "npm-run-all": "^4.1.5",
+    "postcss": "^8.3.11",
     "rollup": "^2.50.1",
-    "rollup-plugin-css-only": "^3.1.0",
-    "rollup-plugin-livereload": "^2.0.0",
+    "rollup-plugin-livereload": "^2.0.5",
+    "rollup-plugin-scss": "^3.0.0",
     "rollup-plugin-svelte": "^7.1.0",
     "rollup-plugin-svg": "^2.0.0",
     "rollup-plugin-terser": "^7.0.2",
+    "sass": "^1.43.4",
     "sirv-cli": "^1.0.12",
-    "svelte": "^3.38.2"
+    "svelte": "^3.43.1"
   },
   "scripts": {
     "update-all": "npm run build && Q update-item",

package/skeletons/custom-code-skeleton/rollup.config.js

@@ -1,13 +1,17 @@
-import resolve from "@rollup/plugin-node-resolve";
+import * as fs from "fs";
+import * as path from "path";
+import nodeResolve from "@rollup/plugin-node-resolve";
 import commonjs from "@rollup/plugin-commonjs";
-import buble from "@rollup/plugin-buble";
 import json from "@rollup/plugin-json";
 import svg from "rollup-plugin-svg";
 import html from "@rollup/plugin-html";
 import svelte from "rollup-plugin-svelte";
 import { terser } from "rollup-plugin-terser";
-import css from "rollup-plugin-css-only";
 import livereload from "rollup-plugin-livereload";
+import scss from "rollup-plugin-scss";
+import postcss from "postcss";
+import cssnano from "cssnano";
+import autoprefixer from "autoprefixer";
 import packageConfig from "./package.json";
 import qConfig from "./q.config.json";
 
@@ -85,6 +89,54 @@ function getHtmlOptions() {
   };
 }
 
+function getPostcssPlugins(isProduction) {
+  const postcssPlugins = [autoprefixer];
+
+  if (isProduction) {
+    postcssPlugins.push(cssnano);
+  }
+
+  return postcssPlugins;
+}
+
+function createOutputCssFunction() {
+  const outputCssFunction = (styles, styleNodes) => {
+    const publicDir = "public";
+
+    if (!fs.existsSync(publicDir)) {
+      fs.mkdirSync(publicDir);
+    }
+
+    fs.writeFileSync(`${publicDir}/bundle.css`, styles);
+  };
+
+  return outputCssFunction;
+}
+
+function getSassConfig(isProduction) {
+  const config = {
+    outputStyle: isProduction ? "compressed" : "expanded",
+    // Sourcemap generation (specifically writing the file to system) is currently not supported by rollup-plugin-sass (but soon!)
+    // See: https://github.com/thgh/rollup-plugin-scss/issues/7
+    // outFile: path.join(__dirname, "/public/default.css"), // <- Uncomment after: https://github.com/thgh/rollup-plugin-scss/issues/7
+    sourceMap: !isProduction,
+    sourceMapEmbed: !isProduction, // Remove after: https://github.com/thgh/rollup-plugin-scss/issues/7
+    failOnError: !isProduction,
+    watch: [path.join(__dirname, "/src")],
+    processor: (css) =>
+      postcss(getPostcssPlugins(isProduction))
+        .process(css, {
+          from: path.join(__dirname, "/public/bundle.css"),
+          to: path.join(__dirname, "/public/bundle.css"),
+          map: isProduction ? false : { inline: true }, // Set to false after: https://github.com/thgh/rollup-plugin-scss/issues/7
+        })
+        .then((result) => result.css),
+    output: createOutputCssFunction(),
+  };
+
+  return config;
+}
+
 export default {
   input: production ? "src/main-prod.js" : "src/main.js",
   output: getOutputConfigs(),
@@ -97,16 +149,19 @@ export default {
         dev: !production,
       },
     }),
-    // we'll extract any component CSS out into
-    // a separate file - better for performance
-    css({ output: "bundle.css" }),
+
+    // All styles have to be written in .scss files (inside '/src')
+    // Sass files (except partials) have to be imported in main.scss file (Use '@use' instead of '@import')
+    // Partials are placed in '/src/styles' (e.g. _variables.scss, _helpers.scss)
+    // Partials are imported directly in other sass files (e.g. _variables.scss -> '@use "variables"')
+    scss({ ...getSassConfig(production) }),
 
     // If you have external dependencies installed from
     // npm, you'll most likely need these plugins. In
     // some cases you'll need additional configuration —
     // consult the documentation for details:
     // https://github.com/rollup/rollup-plugin-commonjs
-    resolve({ browser: true }),
+    nodeResolve({ browser: true }),
     commonjs(),
 
     // Generate a index.html file when not building for production
@@ -114,16 +169,7 @@ export default {
 
     // Watch the `public` directory and refresh the
     // browser on changes when not in production
-    !production && livereload("public"),
-
-    // If we're building for production (npm run build
-    // instead of npm run dev), transpile and minify
-    production &&
-      buble({
-        transforms: {
-          dangerousForOf: true,
-        },
-      }),
+    !production && livereload({ watch: ["public"], delay: 800 }),
     production && terser(),
   ],
   watch: {

package/skeletons/custom-code-skeleton/src/App.scss

@@ -0,0 +1,3 @@
+.app-title {
+  color: salmon;
+}

package/skeletons/custom-code-skeleton/src/App.svelte

@@ -2,10 +2,4 @@
   export let name;
 </script>
 
-<style>
-  .title {
-    color: brown;
-  }
-</style>
-
-<h1 class="title s-font-title">Custom Code {name}</h1>
+<h1 class="app-title s-font-title">Custom Code {name}</h1>

package/skeletons/custom-code-skeleton/src/main-prod.js

@@ -1,3 +1,4 @@
 // file is used for the production since the initializing of the app will happen in Q
 import App from "./App.svelte";
+import "./main.scss";
 export default App;

package/skeletons/custom-code-skeleton/src/main.js

@@ -1,4 +1,5 @@
 import App from "./App.svelte";
+import "./main.scss";
 
 const app = new App({
   target: document.querySelector("#container"),

package/skeletons/custom-code-skeleton/src/main.scss

@@ -0,0 +1 @@
+@use "App.scss";

package/skeletons/server-skeleton/auth/routes.js

@@ -12,9 +12,6 @@ module.exports = [
           password: Joi.string().required(),
         },
       },
-      cors: {
-        credentials: true,
-      },
     },
     handler: async (request, h) => {
       if (
@@ -33,9 +30,6 @@ module.exports = [
     method: "GET",
     config: {
       auth: "q-auth",
-      cors: {
-        credentials: true,
-      },
     },
     handler: (request, h) => {
       if (!request.auth.isAuthenticated) {
@@ -83,9 +77,6 @@ module.exports = [
           allowUnknown: true,
         },
       },
-      cors: {
-        credentials: true,
-      },
     },
     handler: async (request, h) => {
       return "ok";

package/skeletons/server-skeleton/index.js

@@ -57,9 +57,7 @@ async function start() {
         tools: toolsConfig,
         targets: require("./config/targets.js"),
       },
-      routes: {
-        cors: true,
-      },
+      routes: {},
     };
 
     server = Hapi.server(hapiOptions);

package/skeletons/tool-skeleton/.nvmrc

@@ -1 +1 @@
-14
+16

package/skeletons/tool-skeleton/.travis.yml

@@ -0,0 +1,26 @@
+dist: trusty
+sudo: true
+services:
+  - docker
+language: node_js
+node_js:
+  - "16"
+cache:
+  directories:
+    - node_modules
+install:
+  - npm install
+before_script:
+  # TODO: Rename 'q-your-tool' to 'q-<tool-name>'
+  - DOCKER_IMAGE_NAME="q-your-tool"
+  - DOCKER_TAG=${TRAVIS_BRANCH//[^a-zA-Z0-9\_\-\.]/_}
+script:
+  - npm run build
+  - npm run test
+  - 'if [ "$TRAVIS_PULL_REQUEST" = "false" ]; then docker build -t $DOCKER_IMAGE_NAME:$DOCKER_TAG .; fi'
+after_success:
+  - 'if [ "$TRAVIS_PULL_REQUEST" = "false" ]; then echo $DOCKER_PASSWORD | docker login -u="$DOCKER_USERNAME" --password-stdin; docker tag $DOCKER_IMAGE_NAME:$DOCKER_TAG nzzonline/$DOCKER_IMAGE_NAME:$DOCKER_TAG; docker push nzzonline/$DOCKER_IMAGE_NAME:$DOCKER_TAG; fi'
+# TODO: Create token for slack notifications with the slack bot, then insert below & uncomment lines
+# notifications:
+# slack:
+# secure: <Slack-Token>

package/skeletons/tool-skeleton/.vscode/settings.json

@@ -0,0 +1,5 @@
+{
+  "[svelte]": {
+    "editor.defaultFormatter": "svelte.svelte-vscode"
+  }
+}

package/skeletons/tool-skeleton/Dockerfile

@@ -1,5 +1,5 @@
 # Use following version of node alpine as the base image
-FROM node:14-alpine
+FROM node:16-alpine
 
 # Set work directory for run/cmd
 WORKDIR /app

package/skeletons/tool-skeleton/LICENSE

@@ -0,0 +1,20 @@
+MIT License
+
+Copyright (c) 2021 NZZ
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/skeletons/tool-skeleton/README.md

@@ -41,7 +41,7 @@ npx @nzz/q-cli server
 Run the Q tool:
 
 ```
-node index.js
+npm run dev
 ```
 
 [to the top](#table-of-contents)

package/skeletons/tool-skeleton/index.js

@@ -1,12 +1,7 @@
 const Hapi = require("@hapi/hapi");
 const Joi = require("joi");
 
-const server = Hapi.server({
-  port: process.env.PORT || 3000,
-  routes: {
-    cors: true,
-  },
-});
+const server = Hapi.server({ port: process.env.PORT || 3000 });
 server.validator(Joi);
 
 const routes = require("./routes/routes.js");