scullyio / scully Goto Github PK

The Static Site Generator for Angular apps

License: MIT License

JavaScript 1.76% TypeScript 91.80% HTML 0.58% CSS 5.47% Dockerfile 0.34% Shell 0.04%

scully's Introduction

Scully

The best way to build the fastest Angular apps. Scully is a static site generator for Angular projects looking to embrace the Jamstack.

What is Scully?

Scully pre-renders each page in your app to plain HTML & CSS. To do this, Scully uses guessjs to find all of the routes in your project. Scully then visits each route, rendering the view and saving it to an HTML file.

You can then ship all of those HTML files to production. Each view in your app can now be delivered to your users in just a few KBs, as opposed to the hundreds/thousands of KBs require to download your entire Angular app.

Your app appears INSTANTLY on any device (including mobile 3G).

Once the fully-rendered HTML arrives/appears on the user's view, your Angular app will then load and bootstrap on top of the existing view. This means that Scully gives you the best of both worlds:

The ability to pre-render your entire app to the most base form of HTML & CSS.
The ability to still have a full powered SPA written in Angular.

When your app is pre-rendered, users no longer wait until all the JavaScript has downloaded, parsed and executed before they can see and interact with your website. They can immediately begin to see and interact with the page. When your page is IMMEDIATELY available, you will have less abandoned sessions and a much higher conversion rate on your website.

This also means that you may not need to ship your backend to production. Because the view is pre-rendered and the data is fetched at build time, all views that can run without the backend in prod CAN run without the backend in prod. The security and cost implications to that fact can be mind blowing when you think about them.

For those wanting to know more about this process, please read the Getting Started guide. For those who want to know more about the theory behind pre-rendering JavaScript SPAs, our friends at Netlify wrote a free book about the Jamstack. Check that out today.

NOTE!

Please notice that with the release of Scully version 2, support for Angular versions lower as 12 is deprecated. for older versions, you can keep on using the existing 1.1.1 version, which will only receive security updates from now on.

GET A HOLD OF US 24/7

The Scully core team wants to help you any time you need us. We don’t want you to get stuck without help. To make this possible, you have the following ways to get a hold of our team:

The ScullyIO Gitter channel is available to the public, and you can chat questions to us in real time, one of the core team (or the community members) will be there to reply to it.
Each Tuesday we have Office Hours at noon MDT. You can join the entire team and ask your questions.
Our DMs are open on Twitter. Feel free to reach out to us on Twitter.

Core Team

Aaron Frost	Sander Elias	Jorge Cano	Andres Villanueva

aaronfrost	SanderElias	jorgeucano	villanuevand

Created by

HeroDevs. LLC

scully's People

Contributors

Stargazers

Watchers

Forkers

sandyeveliz alvaromashiro kirega sumitparakh mraible matrixy splaktar carlosrojaso beeman mrtungdev gpincheiraa richtillis markus-ende devwolf75 layzeedk gocastilla ixquitilissaid arindamdawn-zz azkarmoulana hypercubed pankajparkar willi84 timdeschryver mbrukman osnoser1 d-koppenhagen sjtrimble chrispinzaru huseyinozkilic blueoceandevops rapzo bennykelly nathanlentz ryotamisawa abrahamjsb milesmeow stewones josiah1888 thuchede guillermoparedes krank2me matrizlab henrysachs juancadev rjrm84 peterblazejewicz gerhardboer webbegg markgoho deerawan ilyassfouih mchl18 schultz44 utopikkad tienduoc xugavin fernandolopestavares jrciii piotrbulkowski doc22940 blinddespair garygrossgarten leonelngande jiverson mburger81 krishnaanaril ni500 sigewuzhere orestes upstateinteractive wenqi73 atao60 anfibiacreativa mtopping ebabel-eu jefiozie thall1961 samvloeberghs modulardata luizgamabh johnny333 maro-amoeba crazybber sfabriece toledonicola hernannadotti-zz urielhdz lorena1m eskura21 lancewalk87 softchris elgurinn pegaltier nartc doggy8088 ankitasinghal ronnysuero salah856 marcjulian jamiev-dfm

scully's Issues

issue: Server Could not connect

somethings scully do not kill all the background servers, and this generate one error when you try to run again,

ERROR: The process "6824" not found.

🐞 Bug report

I'm running Scully for the first time. When I run npm run scully it creates the static files but does not complete and gives the error ### ERROR: The process "6824" not found.

Description

🔬 Minimal Reproduction

I don't know how to reproduce this without sending the whole application over...

💻Your Environment

Angular Version:




Angular CLI: 9.0.0-rc.7
Node: 10.16.3
OS: win32 x64

Angular: 9.0.0-rc.7
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... platform-server, router
Ivy Workspace: Yes

Package                                    Version
--------------------------------------------------------------------
@angular-devkit/architect                  0.900.0-rc.7
@angular-devkit/build-angular              0.900.0-rc.7
@angular-devkit/build-optimizer            0.900.0-rc.7
@angular-devkit/build-webpack              0.900.0-rc.7
@angular-devkit/core                       9.0.0-rc.7
@angular-devkit/schematics                 9.0.0-rc.7
@angular/cdk                               9.0.0-rc.6
@angular/fire                              5.2.3
@angular/http                              7.2.15
@angular/material                          9.0.0-rc.6
@ngtools/webpack                           9.0.0-rc.7
@nguniversal/express-engine                8.2.6
@nguniversal/module-map-ngfactory-loader   8.2.6
@schematics/angular                        9.0.0-rc.7
@schematics/update                         0.900.0-rc.7
rxjs                                       6.5.3
typescript                                 3.6.4
webpack                                    4.41.2

Scully Version:



{
  "name": "thai-basil-prod",
  "version": "1.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "webpack:server": "webpack --config webpack.server.config.js --progress --colors",
    "scully": "scully",
    "scully:serve": "scully serve"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^9.0.0-rc.7",
    "@angular/cdk": "^9.0.0-rc.6",
    "@angular/cli": "^9.0.0-rc.7",
    "@angular/forms": "~9.0.0-rc.7",
    "@angular/http": "^7.2.15",
    "@angular/material": "^9.0.0-rc.6",
    "@angular/platform-browser": "^9.0.0-rc.7",
    "@angular/platform-browser-dynamic": "~9.0.0-rc.7",
    "@angular/platform-server": "~9.0.0-rc.7",
    "@angular/router": "~9.0.0-rc.7",
    "@google/maps": "^1.0.2",
    "@nguniversal/express-engine": "^8.2.6",
    "@nguniversal/module-map-ngfactory-loader": "^8.2.6",
    "@scullyio/init": "0.0.9",
    "@scullyio/ng-lib": "latest",
    "@scullyio/scully": "latest",
    "@types/google-maps": "^3.2.1",
    "@types/googlemaps": "^3.38.1",
    "angular-material-time-picker": "^1.0.8",
    "angular-svg-icon": "^8.0.0",
    "bootstrap": "^4.4.1",
    "core-js": "^3.6.0",
    "cors": "^2.8.5",
    "express": "^4.17.1",
    "firebase": "^7.6.1",
    "luxon": "^1.21.3",
    "ngx-material-timepicker": "^5.2.3",
    "node-sass": "^4.13.0",
    "nodemailer": "^6.4.2",
    "rxjs": "~6.5.3",
    "stripe": "^7.14.0",
    "tslib": "^1.10.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.900.0-rc.7",
    "@angular/common": "^9.0.0-rc.7",
    "@angular/compiler": "^9.0.0-rc.7",
    "@angular/compiler-cli": "~9.0.0-rc.7",
    "@angular/core": "^9.0.0-rc.7",
    "@angular/fire": "^5.2.3",
    "@angular/language-service": "~9.0.0-rc.7",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "^2.0.8",
    "@types/node": "^12.11.1",
    "@types/stripe": "^7.13.18",
    "@types/stripe-checkout": "^1.0.3",
    "@types/stripe-v3": "^3.1.12",
    "bufferutil": "^4.0.1",
    "codelyzer": "^5.1.2",
    "jasmine-core": "~3.5.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.4.1",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "^2.1.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.2",
    "protractor": "~5.4.0",
    "ts-loader": "^6.2.1",
    "ts-node": "~8.5.4",
    "tslint": "~5.20.1",
    "typescript": "~3.6.4",
    "utf-8-validate": "^5.0.2",
    "webpack-cli": "^3.3.10"
  }
}


$ npm run scully

> [email protected] scully C:\Users\marcu\OneDrive\Documents\Develop Denver Code\Thai Basil\Customer 
Facing\thai-basil
> scully

The option outFolder isn't configures, we are using "C:\Users\marcu\OneDrive\Documents\Develop Denver Code\Thai Basil\Customer Facing\thai-basil\dist\static\ by default now"
Cleaned up C:\Users\marcu\OneDrive\Documents\Develop Denver Code\Thai Basil\Customer Facing\thai-basil\dist\static\ folder.
 ☺   new Angular build imported
started servers in background
servers available
Finding all routes in application.
Pull in data to create additional routes.
Route list created in files:
      src\assets\scully-routes.json
      C:\Users\marcu\OneDrive\Documents\Develop Denver Code\Thai Basil\Customer Facing\thai-basil\dist\static\assets\scully-routes.json
Route "/profile" rendered into file: "C:\Users\marcu\OneDrive\Documents\Develop Denver Code\Thai Basil\Customer Facing\thai-basil\dist\static\profile\index.html"
Route "/Terms-Of-Service" rendered into file: "C:\Users\marcu\OneDrive\Documents\Develop Denver Code\Thai Basil\Customer Facing\thai-basil\dist\static\Terms-Of-Service\index.html"
Route "/confirm" rendered into file: "C:\Users\marcu\OneDrive\Documents\Develop Denver Code\Thai Basil\Customer Facing\thai-basil\dist\static\confirm\index.html"
Route "/menu" rendered into file: "C:\Users\marcu\OneDrive\Documents\Develop Denver Code\Thai Basil\Customer Facing\thai-basil\dist\static\menu\index.html"
Route "/about" rendered into file: "C:\Users\marcu\OneDrive\Documents\Develop Denver Code\Thai Basil\Customer Facing\thai-basil\dist\static\about\index.html"
Route "" rendered into file: "C:\Users\marcu\OneDrive\Documents\Develop Denver Code\Thai Basil\Customer Facing\thai-basil\dist\static\index.html"
Route "/ordernow" rendered into file: "C:\Users\marcu\OneDrive\Documents\Develop Denver Code\Thai Basil\Customer Facing\thai-basil\dist\static\ordernow\index.html"
Route list created in files:
      src\assets\scully-routes.json
      C:\Users\marcu\OneDrive\Documents\Develop Denver Code\Thai Basil\Customer Facing\thai-basil\dist\static\assets\scully-routes.json

Generating took 14.02 seconds for 7 pages:
  That is 0.5 pages per second,
  or 2004 milliseconds for each page.

ERROR: The process "6824" not found.

Something I noticed in the static files produced is that the class cdk-global-scrollblock was not removed from the html which I assume is something done by Angular Material. Not sure if this will be fixed after the 6824 bug is fixed.

How to get code highlight in markdown?

If I have the following markdown for blog application, how do I get syntax highlighted?
do you have to add any 3rd party CSS ?

---
title: My second page
author: Sander Elias
publish: true
publish_date: 2019-11-27
description: This is the second demo page in this sample.
---
# Page 3

## its a wild world after all

    ```typescript
      console.log('amazing')
    ```

The ComponentsModule is importing HttpClientModule

🐞 Bug report

Description

The ComponentsModule (in @scullyio/ng-lib) is a widget module that is importing a service module (HttpClientModule).

HttpClientModule should only be imported once per application. Scully's fine init schematic is already making sure to add this to AppModule.

Currently, every lazy-loaded feature module that imports ComponentsModule will add a shadowing provider for HttpClient.

Is this intentional?

🔬 Minimal Reproduction

See metadata for ComponentsModule

💻Your Environment

Angular Version:




Angular CLI: 9.0.0-rc.6
Node: 10.16.0
OS: win32 x64

Angular: 9.0.0-rc.6
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.6
@angular-devkit/build-angular     0.900.0-rc.6
@angular-devkit/build-optimizer   0.900.0-rc.6
@angular-devkit/build-webpack     0.900.0-rc.6
@angular-devkit/core              9.0.0-rc.6
@angular-devkit/schematics        9.0.0-rc.6
@angular/cdk                      8.2.3
@ngtools/webpack                  9.0.0-rc.6
@schematics/angular               9.0.0-rc.6
@schematics/update                0.900.0-rc.6
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Scully Version:




"@scullyio/init": "^0.0.8",
"@scullyio/ng-lib": "^0.0.5",
"@scullyio/scully": "^0.0.45",

🔥 Exception or Error

Show Warning when zero routes configured

🧩 Feature request

Lots of first time scully users are starting to work with Scully, and they are generating blank projects that have zero routes. We need to have Scully render the base route / when zero routes are configured. And we need to show the users an error/warning that they MUST add routes to their Angular app, otherwise scully has nothing to render.

Load statics from md using angular serve

This is more a enhancement

When the app is running with the angular serve does not load the static content, only after runing with scully it works fine.
I think this is expected in alpha, but to improve the development of a blog or any content page based on MD it would be good to also load the statics from Angular.

Running the up with

npm run scully serve

works fine

But runing with angular

ng serve

dosn't show the static content in the markdown

Improve commitizen implementation

Commitizen is already installed, but we need to improve it

Emit blog post data as output of <scully-content>

🧩 Feature request

Description

Within the current implementation the component scully-content will be used to display the content of a blog post.
I think it would be great if the scully-content component will emit an output event containing the parsed data for the content. This feature would give you the ability to process some meta data additionally and display for example a related thumbnail image or tags.

Describe the solution you'd like

Imaging a markdown file like this:

---
title: 'Foo Bar Baz'
publish: true
author: John Doe
mail: [email protected]
keywords:
  - Scully
  - Angular
thumbnail: assets/images/blog/pwaheader.jpg
---

# Foo
bar...

Scully will currently process this data and display the text below the meta data information but it already parses the meta data.
When it will emit an event with the data, a user can process this data and can handle this meta data information:

<img [src]="thumbnail" />
<scully-content (data)="thumbnail = $event"></scully-content>

Describe alternatives you've considered

Have you considered any alternative solutions or workarounds?

App without Ivy gives error: No provider for IdleMonitorService!

First of all: congrats on the release! 🥳 I'm super exited to start exploring and using this, it's something I've been looking out for for a while now!

I'll file some issues and later probably some PR's, here's the first thing I ran into.

Issue

When creating a new app with the latest version of @angular/cli (8.3.20) it has ivy disabled, this seems to yield this error:

ERROR NullInjectorError: StaticInjectorError(AppModule)[AppComponent -> IdleMonitorService]: 
  StaticInjectorError(Platform: core)[AppComponent -> IdleMonitorService]: 
    NullInjectorError: No provider for IdleMonitorService!
    at NullInjector.get (http://localhost:4200/vendor.js:39072:27)
    at resolveToken (http://localhost:4200/vendor.js:53990:24)
    at tryResolveToken (http://localhost:4200/vendor.js:53916:16)
    at StaticInjector.get (http://localhost:4200/vendor.js:53766:20)
    at resolveToken (http://localhost:4200/vendor.js:53990:24)
    at tryResolveToken (http://localhost:4200/vendor.js:53916:16)
    at StaticInjector.get (http://localhost:4200/vendor.js:53766:20)
    at resolveNgModuleDep (http://localhost:4200/vendor.js:64953:29)
    at NgModuleRef_.get (http://localhost:4200/vendor.js:66019:16)
    at resolveDep (http://localhost:4200/vendor.js:66550:45)

Workaround

To get around this error you can enable ivy by adding the following object to tsconfig.app.json and tsconfig.app.json:

   "angularCompilerOptions": {
     "enableIvy": true
   }

Or when you start a new project, generate it with the enable-ivy flag:

ng new scully-with-ivy --routing --style=scss --enable-ivy true

Repro steps

See demo or:

ng new scully-no-ivy --routing --style=scss --enable-ivy false
cd scully-no-ivy
ng add @scullyio/init
ng serve

Could not connect to server

🐞 bug report

Description

Tried running scully on an angular 9 app, got an error.

🔬 Minimal Reproduction

Run scully

💻Your Environment

Angular CLI: 9.0.0-rc.6
Node: 12.8.1
OS: darwin x64

🔥 Exception or Error


started servers in background
Could not connect to server

Cannot read property 'toString' of null

🐞 Bug report

i am trying to add scullyio to an existing nrwl nx monorepo project (which is already angular 9 rc)

Cannot add @scullyio/init to my angular 9 project.

Description

🔬 Minimal Reproduction

ng add @scullyio/init
Installing packages for tooling via yarn.
Installed packages for tooling via yarn.
    ✅️ Added dependency
    ✅️ Import HttpClientModule into root module
Cannot read property 'toString' of null

💻Your Environment

Angular Version:



Angular CLI: 9.0.0-rc.7
Node: 13.5.0
OS: darwin x64

Angular: 9.0.0-rc.7
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, localize, platform-browser
... platform-browser-dynamic, router, service-worker
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.5
@angular-devkit/build-angular     0.900.0-rc.7
@angular-devkit/build-optimizer   0.900.0-rc.7
@angular-devkit/build-webpack     0.900.0-rc.5
@angular-devkit/core              9.0.0-rc.5
@angular-devkit/schematics        9.0.0-rc.5
@angular/cdk                      8.2.3
@ngtools/webpack                  9.0.0-rc.7
@schematics/angular               9.0.0-rc.7
@schematics/update                0.900.0-rc.7
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Scully Version:


latest

🔥 Exception or Error


ng add @scullyio/init
Installing packages for tooling via yarn.
Installed packages for tooling via yarn.
    ✅️ Added dependency
    ✅️ Import HttpClientModule into root module
Cannot read property 'toString' of null

reduce npm footprint 🌱

🧩 Feature request

Description

priority: nice to have

When adding your awesome library the usage of disk space increase 3x.

# 353 MB basic angular setup with router
ng new --routing=true <project> 

# 919 MB with scully => @scullyio package ist just 85 MB
ng add @scullyio/init => 919 MB (@scullyio just 85 MB)

Angular has already a big footprint, when you try to install it on a small machine or in a wifi with restrictions (e.g. German ICE high speed train wifi: 200 MB high-speed data).

And it will also reduce the 🌱 CO2 footprint ;-)

Describe the solution you'd like

Try to remove or replace to big dependencies

Describe alternatives you've considered

no alternative possible when you are restricted in disk space or wifi speed ;-)

Options for @scullyio/init:markdown and @scullyio/init:blog

🧩 Feature request

When generating a new blog it would be great to have some more Options:

ng g @scullyio/init:blog <options>

Description

I think it would be good to have at least three more configuration options when creating a blog, to define the basic module name, the source directory for the blog content files and the route for availability of the static pages.

Describe the solution you'd like

baseName - The basic Name and prefix that's used for the BlogModule and BlogComponent, etc. This should be set to blog by default (with this it wouldn't break the current behavior)
sourceDir - This parameter should define the source directory for the blog files (*.md). It should be set to blog by default (with this it wouldn't break the current behavior)
route - This parameter should define the route under which the blog sites are available. It should be set to blog/:slug by default (with this it wouldn't break the current behavior)

A further benefit is that it would allow one to create multiple different blog areas:

ng g @scullyio/init:blog
ng g @scullyio/init:blog --baseName=“project” --sourceDir=“projects” --route=“project/:slug”

This functionality would also affect the generation of new entries:

ng g @scullyio/init:post --name="This is a new blog post"  # use `blog` by default, no breaking change
ng g @scullyio/init:post --name="This is a new project description" --target="project" # matches with `sourceDir`

What do you think?

Could not connect to server Error with nx monorepo project

🐞 Bug report

Description

I have fresh nrwl nx monorepo.
i added blog module , then try to build static site.

yarn run scully throws Could not connect to server error .

the code works fine with ng server and open http://localhost:4200/home/blog

🔬 Minimal Reproduction

git clone https://github.com/xmlking/yeti.git
cd yeti
ng build && yarn run scully 
# this throw error

yarn run scully serve

💻Your Environment

Angular Version:


Angular CLI: 9.0.0-rc.7
Node: 13.5.0
OS: darwin x64

Angular: 9.0.0-rc.7
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, localize, platform-browser
... platform-browser-dynamic, router, service-worker
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.5
@angular-devkit/build-angular     0.900.0-rc.7
@angular-devkit/build-optimizer   0.900.0-rc.7
@angular-devkit/build-webpack     0.900.0-rc.5
@angular-devkit/core              9.0.0-rc.5
@angular-devkit/schematics        9.0.0-rc.5
@angular/cdk                      8.2.3
@ngtools/webpack                  9.0.0-rc.7
@schematics/angular               9.0.0-rc.7
@schematics/update                0.900.0-rc.7
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Scully Version:


0.0.9

🔥 Exception or Error


 yarn run scully
yarn run v1.21.1
$ scully
Cleaned up /Users/schintha/Developer/Work/SPA/yeti/dist/scully/apps/webapp folder.
 ☺   new Angular build imported
started servers in background
Could not connect to server
✨  Done in 16.65s.

Invalid content-type. Expected application/json but received text/html; charset=UTF-8

🐞 Bug report

Description

I'm running into an issue where I can't get Scully to run in my project.

It looks like it can't connect to Puppeteer, though that's a wild guess.

A repro can be found in this repo. In order to make sure it's not something on my local machine I've added a Docker configuration that shows the issue.

🔬 Minimal Reproduction

In order to get this error:

git clone https://github.com/beeman/scully-starter
cd scully-starter
yarn docker:build


.....DOCKER BUILD OUTPUT HERE.....
$ scully
The option outFolder isn't configures, we are using "/workspace/dist/static/ by default now"
Cleaned up /workspace/dist/static/ folder.
 ☺   new Angular build imported
started servers in background
Invalid content-type.
Expected application/json but received text/html; charset=UTF-8
Invalid content-type.
Expected application/json but received text/html; charset=UTF-8
Invalid content-type.
Expected application/json but received text/html; charset=UTF-8
Invalid content-type.
Expected application/json but received text/html; charset=UTF-8
Invalid content-type.
Expected application/json but received text/html; charset=UTF-8
Invalid content-type.
Expected application/json but received text/html; charset=UTF-8
Invalid content-type.
Expected application/json but received text/html; charset=UTF-8
Invalid content-type.
Expected application/json but received text/html; charset=UTF-8
Invalid content-type.
Expected application/json but received text/html; charset=UTF-8
Could not connect to server

💻Your Environment

Angular Version:



     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 9.0.0-rc.7
Node: 12.12.0
OS: darwin x64

Angular: 9.0.0-rc.7
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.7
@angular-devkit/build-angular     0.900.0-rc.7
@angular-devkit/build-optimizer   0.900.0-rc.7
@angular-devkit/build-webpack     0.900.0-rc.7
@angular-devkit/core              9.0.0-rc.7
@angular-devkit/schematics        9.0.0-rc.7
@angular/cdk                      8.2.3
@ngtools/webpack                  9.0.0-rc.7
@schematics/angular               9.0.0-rc.7
@schematics/update                0.900.0-rc.7
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Scully Version:


    "@scullyio/init": "0.0.9",
    "@scullyio/ng-lib": "0.0.7",
    "@scullyio/scully": "0.0.46",

🔥 Exception or Error

generated Scully code breaks build when compiler option `noUnusedParameters` is activated

🐞 bug report

Description

With TypeScript compiler option noUnusedParametersactivated, generated Scully code breaks the build:

export class AppComponent {
  constructor(private idle: IdleMonitorService) {} // unused parameter idle

  title = "xyz";
}

Fixed by changing generated code to:

export class AppComponent {
  constructor(idle: IdleMonitorService) {
    idle.init();
  }

  title = "xyz";
}

🔬 Minimal Reproduction

Create new Angular 9 project
Install scully
Run ng build

💻Your Environment

Angular Version:


Angular CLI: 9.0.0-rc.6
Node: 12.14.0
OS: linux x64

Angular: 9.0.0-rc.6
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.6
@angular-devkit/build-angular     0.900.0-rc.6
@angular-devkit/build-optimizer   0.900.0-rc.6
@angular-devkit/build-webpack     0.900.0-rc.6
@angular-devkit/core              9.0.0-rc.6
@angular-devkit/schematics        9.0.0-rc.6
@angular/cdk                      8.2.3
@ngtools/webpack                  9.0.0-rc.6
@schematics/angular               9.0.0-rc.6
@schematics/update                0.900.0-rc.6
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Scully Version:


    "@scullyio/init": "0.0.8",
    "@scullyio/ng-lib": "latest",
    "@scullyio/scully": "latest",

error when clicked on markdown generated link

🐞 Bug report

Description

I have a link (/home/blog) in my markdown blog-post to blog-post-lust-view as shown below
When I click the link, <a href="/home/blog">site-map</a> I am getting following error

libs-home-src-lib-home-module-es2015.js:902 problem during parsing static scully content TypeError: Cannot read property 'split' of undefined

Markdown blog

---
title: blog 1
description: This is the first demo blog in this sample.
---

# blog 1

## its a wild world after all

Related information [blog-2](/home/blog/blog-2)

[site-map](/home/blog)

🔬 Minimal Reproduction

💻Your Environment

Angular Version:

Scully Version:

🔥 Exception or Error

I think the error is caused at


https://github.com/scullyio/scully/blob/master/projects/scullyio/ng-lib/src/lib/scully-content/scully-content.component.ts#L75

Add CLA or Contributor License Agreement

🧩 Feature request

Description

The purpose of a CLA is to ensure that the guardian of a project's outputs has the necessary ownership or grants of rights over all contributions to allow them to distribute under the chosen license. In some cases this will mean that the contributor will assign the copyright in all contributions to the project owner; in other cases, they will grant an irrevocable license to allow the project maintainer to use the contribution. CLAs also have roles in raising awareness of IPR issues within a project.

Contributor Licence Agreements by Ross Gardler and Rowan Wilson

Describe the solution you'd like

Add CLA Assitant | https://cla-assistant.io/

use defined project prefix if set

generating a blog using scully should use the defined app prefix from angular.json file instead of always app.

Running this:

ng g @scullyio/init:blog

... will currently always lead to this blog.component.ts file content:

...
@Component({
  selector: 'app-blog',
  ...
})
...

If a prefix is set in angular.json (path: projects => <project name> => prefix) it should be used by scully for setting it:

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  ...
  "projects": {
    "my-project": {
      ...
      "prefix": "foo",
    }
  }
}

...
@Component({
  selector: 'app-blog',
  ...
})
...

Warn Users when an Angular route w/ route param doesn't have a config in the scully.config.js

When a user runs npm run scully to pre-render their app, they may have their project mis-configured. We need to help them get it configured properly.

One way we can do this is to guide them when we detect the error.

When the Angular app has a route with a route param (example: user/:userId) but the scully.config.ts doesn't have a router plugin configured for that route, we need to warn them that they need to configure the route in order for scully to pre-render it. In the console, include a link to the docs for setting up plugins.

Created index.html is not static

🐞 bug report

Description

The created index.html is not a static html file but the original index.html.

🔬 Minimal Reproduction

Create new Angular 9 project
Install scully
Run npm run scully

💻Your Environment

Angular Version:


Angular CLI: 9.0.0-rc.6
Node: 12.14.0
OS: linux x64

Angular: 9.0.0-rc.6
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.6
@angular-devkit/build-angular     0.900.0-rc.6
@angular-devkit/build-optimizer   0.900.0-rc.6
@angular-devkit/build-webpack     0.900.0-rc.6
@angular-devkit/core              9.0.0-rc.6
@angular-devkit/schematics        9.0.0-rc.6
@angular/cdk                      8.2.3
@ngtools/webpack                  9.0.0-rc.6
@schematics/angular               9.0.0-rc.6
@schematics/update                0.900.0-rc.6
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Scully Version:


    "@scullyio/init": "0.0.8",
    "@scullyio/ng-lib": "latest",
    "@scullyio/scully": "latest",

`fileHandler` plugins are global when registered, and not configurable by route.

🧩 Feature request

If I have one route that should use one markdown fileHandler, and a separate route that should use a different markdown fileHandler, I am currently unable to do this. fileHandler plugins are global, and I am not able to configure them per route. We need to make this possible.

Don't require configValidator. Just warn if absent.

🧩 Feature request

Don't fail without config validators. Just warn, and add a default config validator.

Allow chaining of plugins

🧩 Feature request

If I have two plugins that I want to use on the same files, I should be able to chain them.

Description

If I have a route in my scully.config.js that is configured as such:

'blog/:slugId' : {
  type: 'contentFolder`,
  slugId: {
    folder: './blog'
  }
}

And I want each of the markdown files in that directory to be processed through the contentFolder render plugin AND ALSO a second render plugin that I created, that should be an option.

Imagine that I had a render plugin that transformed the rendered HTML and replaced :) with 😊, and I want that plugin to be ran AFTER the contentFolder plugin, I should be able to do this.

Describe the solution you'd like

'blog/:slugId' : {
  type: ['contentFolder', 'smiley'],
  slugId: {
    folder: './blog'
  }
}

Describe alternatives you've considered

I realize that I can import the contentFolder plugin in the smiley plugin setup, and then run it and chain it manually. But it is more useful if we allow people to dynamically build these configurations inside of the scully.config.js.

I could write the smiley render plugin like this:

function smileyRenderPlugin(html, route) {
    return contentRenderPlugin(html, route).then(html => {
        return html.replace(/\:\)/g, '😊');
    })
}
registerPlugin('render', 'smiley', smileyRenderPlugin);

If I took this and then used type: 'smiley' in the route config, I run into several additional problems.

First, while this would allow me, the plugin author, to compose a new plugin from other plugins, it doesn't allow the plugin consumer to compose them together. But I want to allow the plugin consumers to be able to compose these as well. Much in the same way that a webpack consumer can compose the uses of webpack plugins.

Second, if I compose together in this way, then I have to make an accompanying route plugin as well. The contentFolder plugin has both a registered router plugin as well as a render plugin. If I create a smiley render plugin, I also have to create a smiley router plugin. I can totally do this, but it isn't as user friendly as I would like.

We need this system to be the most user-friendly SSG in the history of them. We need to allow them to be composable.

`dist/static/index.html` isn't generated when using `redirectTo` for root path

🐞 Bug report

Description

🔬 Minimal Reproduction

💻Your Environment

Angular Version:


Angular CLI: 9.0.0-rc.3
Node: 10.16.0
OS: darwin x64
Angular: 9.0.0-rc.3
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.3
@angular-devkit/build-angular     0.900.0-rc.3
@angular-devkit/build-optimizer   0.900.0-rc.3
@angular-devkit/build-webpack     0.900.0-rc.3
@angular-devkit/core              9.0.0-rc.3
@angular-devkit/schematics        8.3.21
@angular/cdk                      9.0.0-rc.4
@angular/flex-layout              8.0.0-beta.27
@angular/material                 9.0.0-rc.4
@ngtools/webpack                  9.0.0-rc.3
@schematics/angular               9.0.0-rc.3
@schematics/update                0.900.0-rc.3
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Scully Version:


    "@scullyio/init": "^0.0.8",
    "@scullyio/ng-lib": "latest",
    "@scullyio/scully": "latest",

🔥 Exception or Error

My routes are this.

[
        {
          path: '',
          pathMatch: 'full',
          redirectTo: 'about',
        },
        {
          path: 'about',
          loadChildren: () =>
            import('./modules/about-page/about-page.module').then(
              m => m.AboutPageModule,
            ),
        },
        {
          path: 'articles',
          loadChildren: () =>
            import('./modules/articles-page/articles-page.module').then(
              m => m.ArticlesPageModule,
            ),
        },
        {
          path: 'slides',
          loadChildren: () =>
            import('./modules/slides-page/slides-page.module').then(
              m => m.SlidesPageModule,
            ),
        },
        {
          path: 'timeline',
          loadChildren: () =>
            import('./modules/timeline-page/timeline-page.module').then(
              m => m.TimelinePageModule,
            ),
        },
      ],

This app redirects from / to /about. Scully generates only about, articles, slides and timeline. /index.html for root is not generated.
Is this by design? If it is not, how I can handle this problem?

Question: Product Lists

Hi, I heard about Scully from Fireship and am really impressed. My team and I have battled with Angular Universal for 6 months now so this was much needed. We're ready to start converting my angular apps now!
Though, I do have a question. There are some pages that display products based off data from Firestore- a database.

With scully, will this content to be fetched and rendered to the static pages? Would there be a difference if it is fetched in the constructor vs ngoninit? What are considerations here?

Since we deal with product lists (which for us change infrequently) we would need to build for scully and deploy nightly (or maybe even when DB changes). Any templates for cloud functions to do this?

Thanks guys!

ng g @scullyio/init:blog does not create blog module

🐞 Bug report

Description

Running ng g @scullyio/init:blog does not create a blog module/route in my app, only a blog folder in my root project and a adds new object to scully.config.js.

🔬 Minimal Reproduction

ng g @scullyio/init:blog
    ✅ 12-24-2019-blog file created
    ✅️ Update scully.config.js
CREATE blog/12-24-2019-blog.md (98 bytes)
UPDATE scully.config.js (168 bytes)

💻Your Environment

Angular Version:



     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 9.0.0-rc.7
Node: 12.12.0
OS: darwin x64

Angular: 9.0.0-rc.7
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.7
@angular-devkit/build-angular     0.900.0-rc.7
@angular-devkit/build-optimizer   0.900.0-rc.7
@angular-devkit/build-webpack     0.900.0-rc.7
@angular-devkit/core              9.0.0-rc.7
@angular-devkit/schematics        9.0.0-rc.7
@angular/cdk                      8.2.3
@ngtools/webpack                  9.0.0-rc.7
@schematics/angular               9.0.0-rc.7
@schematics/update                0.900.0-rc.7
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Scully Version:


    "@scullyio/init": "0.0.9",
    "@scullyio/ng-lib": "0.0.7",
    "@scullyio/scully": "0.0.46",

🔥 Exception or Error

npm run scully (Getting count not connect to server)

🐞 Bug report

Description

dist/static folder is not being generated. npm run scully stucks at started servers in backend and after sometime it disconnects while showing Could not connect to server. It was working sometime ago, suddenly stopped working. I'm using windows 10.

Getting the same issue inside netlify too, it was building there too,

🔬 Minimal Reproduction

💻Your Environment

Angular Version:
^9.0.0-rc.7

Scully Version:
"@scullyio/init": "0.0.8", "@scullyio/ng-lib": "latest", "@scullyio/scully": "0.0.45",

Couldn't find a route declaration in /src/app/app.module.ts

Since ng g @scullyio/init:blog requires a route declaration, should the Blog Doc contain an "observation" so the user has the AppRoutingModule import? Or is it not required and I'm missing something?

Have a great day and Team Scully all the way!

schematics: inputs should be sanitized

🐞 Bug report

Description

The inputs for the schematics to create a post or markdown should be sanitized.

🔬 Minimal Reproduction

The following command generated a new post as /blog/first/post.md, the post will not be found in this case.

ng g @scullyio/init:post --name="first/post"

A similar thing happens to the markdown schematic, this command creates invalid JSON in the config:

ng g @scullyio/init:markdown --name=my-test! --slug=my-test!

exports.config = {
  projectRoot: "./src/app",
  routes: {
    '/my-test!/:my-test!': {
      type: 'contentFolder',
      my-test!: {
        folder: "./my-test!"
      }
    }
  }
};

💻Your Environment

Angular Version:


Latest

Scully Version:


Latest

🔥 Exception or Error

cli: support catch all routes (i.e. to a custom 404 page)

Steps to Reproduce

ng add @scullyio/init
npm i --save-dev fs-extra
ng build
npm run scully

Error

Cleaned up /Users/splaktar/Git/.../dist/static/ folder.
started servers in background
Invalid content-type.
Expected application/json but received text/html; charset=UTF-8
<repeated about 30 times>
Invalid content-type.
Expected application/json but received text/html; charset=UTF-8
Could not connect to server

The debugger indicates that this is caused by the following line

scully/scully/utils/waitForServerToBeAvailable.ts

Line 13 in eba6fba

httpGetJson('http://localhost:1864/_pong', {suppressErrors: true})

That URL (http://localhost:1864/_pong) seems to be returning my Angular app (in a broken state) rather than some JSON content.

Root Cause

A route like {path: '**', component: PageNotFoundComponent} breaks the ability to run Scully. Removing it works around the problem, but breaks the app's custom 404 page.

Cannot find module 'fs-extra', when running scully npm script

🐞 bug report

Description

npm run scully fails with message:

Error: Cannot find module 'fs-extra'

(Fixed by installing fs-extra)

🔬 Minimal Reproduction

Create new Angular 9 project
Install scully
Run npm run scully

💻Your Environment

Angular Version:


Angular CLI: 9.0.0-rc.6
Node: 12.14.0
OS: linux x64

Angular: 9.0.0-rc.6
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.6
@angular-devkit/build-angular     0.900.0-rc.6
@angular-devkit/build-optimizer   0.900.0-rc.6
@angular-devkit/build-webpack     0.900.0-rc.6
@angular-devkit/core              9.0.0-rc.6
@angular-devkit/schematics        9.0.0-rc.6
@angular/cdk                      8.2.3
@ngtools/webpack                  9.0.0-rc.6
@schematics/angular               9.0.0-rc.6
@schematics/update                0.900.0-rc.6
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Scully Version:


    "@scullyio/init": "0.0.8",
    "@scullyio/ng-lib": "latest",
    "@scullyio/scully": "latest",

🔥 Exception or Error


Error: Cannot find module 'fs-extra'
Require stack:
- /(...)/node_modules/@scullyio/scully/bin/scully.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:797:15)
    at Function.Module._load (internal/modules/cjs/loader.js:690:27)
    at Module.require (internal/modules/cjs/loader.js:852:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Object.<anonymous> (/(...)/node_modules/@scullyio/scully/bin/scully.js:7:20)
    at Module._compile (internal/modules/cjs/loader.js:959:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:995:10)
    at Module.load (internal/modules/cjs/loader.js:815:32)
    at Function.Module._load (internal/modules/cjs/loader.js:727:14)
    at Function.Module.runMain (internal/modules/cjs/loader.js:1047:10) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/(...)/node_modules/@scullyio/scully/bin/scully.js'
  ]




Add Gitter to docs

🗄️ Docs report
Description
A clear and concise description of the problem...
Add Gitter channel to the docs.
🔬 Minimal Reproduction
--
What's the affected URL?**
https://gitter.im/scullyio/community
Reproduction Steps**
--
Expected vs Actual Behavior**
--
📷Screenshot
🔥 Exception or Error





🌍 Your Environment
Browser info
Anything else relevant?




add option to @scullyio/init:post to specific blog directory

🧩 Feature request
Description
ng g @scullyio/init:post --name="awesome owls"  only added to /blog directory. If i have two blogs, post command dont have option to specify the blog diretory
Describe the solution you'd like
If you have a solution in mind, please describe it.
ng g @scullyio/init:post --name="awesome owls" --directory="./clog"
Describe alternatives you've considered
Have you considered any alternative solutions or workarounds?







ERROR: The process "81564" not found.

🐞 Bug report
I'm running Scully for the first time. When I run npm run scully it creates the static files but does not complete and gives the error ### ERROR: The process "81564" not found. Do i really have to update my cli version ??
Description
🔬 Minimal Reproduction
ng add @scullyio/init

ng build

npm run scully
Then added below command and ran again

ng g @scullyio/init:blog

npm run scully
💻Your Environment
Angular Version:



Angular CLI: 8.3.4
Node: 10.15.3
OS: win32 x64
Angular:
...

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.803.4
@angular-devkit/core         8.3.4
@angular-devkit/schematics   8.3.4
@schematics/angular          8.3.4
@schematics/update           0.803.4
rxjs                         6.4.0

Scully Version:



{
  "name": "static-site-gen",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "scully": "scully",
    "scully:serve": "scully serve"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~8.2.5",
    "@angular/common": "~8.2.5",
    "@angular/compiler": "~8.2.5",
    "@angular/core": "~8.2.5",
    "@angular/forms": "~8.2.5",
    "@angular/platform-browser": "~8.2.5",
    "@angular/platform-browser-dynamic": "~8.2.5",
    "@angular/router": "~8.2.5",
    "@scullyio/init": "0.0.9",
    "@scullyio/ng-lib": "latest",
    "@scullyio/scully": "latest",
    "rxjs": "~6.4.0",
    "tslib": "^1.10.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.803.4",
    "@angular/cli": "~8.3.4",
    "@angular/compiler-cli": "~8.2.5",
    "@angular/language-service": "~8.2.5",
    "@types/node": "~8.9.4",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.5.3"
  }
}

🔥 Exception or Error



Generating took 32.14 seconds for 1 pages:
  That is 0.04 pages per second,
  or 32147 milliseconds for each page.

ERROR: The process "81564" not found.





Adding Scully breaks the default Angular app

🐞 Bug report
Hello, I was checking out Scully, but got an error after adding it to the default scaffolded Angular app.
Description
🔬 Minimal Reproduction
on Windows 10

Create a default Angular project

ng new awesome-angular-blog

(answer Yes, SCSS)

cd awesome-angular-blog

ng serve --open

The default app opens ok and works. Let's add Scully.

ng add @scullyio/init

ng serve --open

it opens up a blank screen with the error listed below. So, the app no longer works.

Simply adding Scully breaks ng serve.

💻Your Environment
Angular Version:

Angular CLI: 8.3.21
Node: 10.16.0
OS: win32 x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.803.21
@angular-devkit/build-angular     0.803.21
@angular-devkit/build-optimizer   0.803.21
@angular-devkit/build-webpack     0.803.21
@angular-devkit/core              8.3.21
@angular-devkit/schematics        8.3.21
@angular/cdk                      8.2.3
@angular/cli                      8.3.21
@ngtools/webpack                  8.3.21
@schematics/angular               8.3.21
@schematics/update                0.803.21
rxjs                              6.4.0
typescript                        3.5.3
webpack                           4.39.2


Scully Version:

{
  "name": "awesome-angular-blog",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "scully": "scully",
    "scully:serve": "scully serve"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~8.2.14",
    "@angular/common": "~8.2.14",
    "@angular/compiler": "~8.2.14",
    "@angular/core": "~8.2.14",
    "@angular/forms": "~8.2.14",
    "@angular/platform-browser": "~8.2.14",
    "@angular/platform-browser-dynamic": "~8.2.14",
    "@angular/router": "~8.2.14",
    "@scullyio/init": "0.0.9",
    "@scullyio/ng-lib": "latest",
    "@scullyio/scully": "latest",
    "rxjs": "~6.4.0",
    "tslib": "^1.10.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.803.21",
    "@angular/cli": "~8.3.21",
    "@angular/compiler-cli": "~8.2.14",
    "@angular/language-service": "~8.2.14",
    "@types/node": "~8.9.4",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.5.3"
  }
}


🔥 Exception or Error

ERROR NullInjectorError: StaticInjectorError(AppModule)[AppComponent -> IdleMonitorService]: 
  StaticInjectorError(Platform: core)[AppComponent -> IdleMonitorService]: 
    NullInjectorError: No provider for IdleMonitorService!
    at NullInjector.get (http://localhost:4200/vendor.js:39072:27)
    at resolveToken (http://localhost:4200/vendor.js:53990:24)
    at tryResolveToken (http://localhost:4200/vendor.js:53916:16)
    at StaticInjector.get (http://localhost:4200/vendor.js:53766:20)
    at resolveToken (http://localhost:4200/vendor.js:53990:24)
    at tryResolveToken (http://localhost:4200/vendor.js:53916:16)
    at StaticInjector.get (http://localhost:4200/vendor.js:53766:20)
    at resolveNgModuleDep (http://localhost:4200/vendor.js:64953:29)
    at NgModuleRef_.get (http://localhost:4200/vendor.js:66019:16)
    at resolveDep (http://localhost:4200/vendor.js:66550:45)




NPM Readme.md is outdated

🗄️ Docs report
Description
A clear and concise description of the problem...
README.md file used my NPM is old.

We need to update with :

Badges of tools
Links to Gitter
New info of Office Hours

🔬 Minimal Reproduction
What's the affected URL?**
https://github.com/scullyio/scully/blob/master/scully/readme.md
Reproduction Steps**
Expected vs Actual Behavior**
📷Screenshot
🔥 Exception or Error





🌍 Your Environment
Browser info
Anything else relevant?




provide --host flag for alternative hosts (otherwise scully not works)

🧩 Feature request
Description
For some working environments, where localhost is by default not available to use (e.g. strict company VMs).

When I start npm run scully the mechanism tries to connecto to http://localhost:1864/_pong. But this is not possible in my enviroment, because it redirects to http://myhost:1864/_pong
Describe the solution you'd like
Angular provides for ng serve a --host flag, this could be also a solution for you.

The first line it crashed for me was here:




scully/scully/utils/waitForServerToBeAvailable.ts


Line 13
in
8ce6c13






 httpGetJson('http://localhost:1864/_pong', {suppressErrors: true}) 





But there are maybe also other points.
Describe alternatives you've considered
I tried to edit it directly in the source code. It worked until the next issue (no chromium available for my OS)



Questions: Should we recommend self-registering plugins or manually registering plugins?

Self Registered Plugins vs Manually Registered Plugins
When people build a plugin for Scully, should we recommend a self registering plugin or a plugin that they will still need to call registerPlugin on?

// in your scully.config.js

// Self Registered Plugins 
require("community-plugin");

// Manually Register Plugins
const communityPlugin = require("community-plugin");
registerPlugin('router', 'somenameofmychoosing', communityPlugin);
Which of these options would be the best? I am leaning towards Self Registered Plugins.







projectRoot missing in "scully.json" due to fs_extra_1.pathExists is not a function

Steps to Reproduce

ng add @scullyio/init
ng build
npm run scully

Error
npm run scully

TypeError: fs_extra_1.pathExists is not a function
    at Object.exports.compileConfig (/Users/splaktar/Git/.../node_modules/@scullyio/scully/bin/utils/compileConfig.js:15:32)
    at loadIt (/Users/splaktar/Git/.../node_modules/@scullyio/scully/bin/utils/config.js:15:50)
    at Object.<anonymous> (/Users/splaktar/Git/.../node_modules/@scullyio/scully/bin/utils/config.js:50:22)
    at Module._compile (internal/modules/cjs/loader.js:956:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:973:10)
    at Module.load (internal/modules/cjs/loader.js:812:32)
    at Function.Module._load (internal/modules/cjs/loader.js:724:14)
    at Module.require (internal/modules/cjs/loader.js:849:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Object.<anonymous> (/Users/splaktar/Git/.../node_modules/@scullyio/scully/bin/routerPlugins/contentFolderPlugin.js:6:18)
projectRoot missing in "scully.json"
No routes defined in "scully.config"
Looking at my scully.config.js file:
exports.config = {
  projectRoot: "./src/app",
  routes: {
  }
};
The projectRoot is defined and seems to be correct for my repo.
Since I don't have any routes that have params, do I need to define routes: {} in scully.config.js?
The error message seems to be referring to the wrong file name? scully.json



asciidoctor show a warning every time

🐞 Bug report
Description
When use asciidoctor show a warning every time
🔬 Minimal Reproduction
run scully into the main project
💻Your Environment
Angular Version:





Scully Version:





🔥 Exception or Error

asciidoctor: WARNING: : line 238: invalid style for paragraph: Illustration




Running ng add @scullyio/init a second time should not break the app

Issue
When running ng add @scullyio/init a second time in the same app, it makes the same updates to src/app/app.component.ts (which breaks the app) and src/polyfills.ts.
It's probably nice to add a check to see if the content already exists in those files and skip the addition if so (here and here).



cli: dist/static does not include assets if Angular project is output to dist/

🐞 Bug report
Description
In dist/static, I have the following

index.html
assets

scully-routes.json



My webmanifest.manifest, favicon.ico, sitemap.xml, robots.txt, etc aren't available on my static site. It seems like all of this stuff is configured in the angular.json and part of my build in dist/, so it seems like Scully should copy that over for the static site? Or is there some other step or approach that I'm missing?
🔬 Minimal Reproduction

Generate a new app with the CLI
Follow the Scully docs
Check to see if your favicon.ico loads on your static site and that it's in dist/static/favicon.ico

💻Your Environment
Angular Version:

Angular CLI: 9.0.0-rc.6
Node: 12.13.0
OS: darwin x64

Angular: 9.0.0-rc.6
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router, service-worker
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.6
@angular-devkit/build-angular     0.900.0-rc.6
@angular-devkit/build-optimizer   0.900.0-rc.6
@angular-devkit/build-webpack     0.900.0-rc.6
@angular-devkit/core              9.0.0-rc.6
@angular-devkit/schematics        9.0.0-rc.6
@angular/cdk                      9.0.0-rc.5
@angular/fire                     5.2.3
@angular/material                 9.0.0-rc.5
@ngtools/webpack                  9.0.0-rc.6
@schematics/angular               9.0.0-rc.6
@schematics/update                0.900.0-rc.6
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Scully Version:

    "@scullyio/init": "0.0.8",
    "@scullyio/ng-lib": "latest",
    "@scullyio/scully": "latest",

🔥 Exception or Error

GET http://localhost:5000/firebase-performance-es2015.js net::ERR_ABORTED 404 (Not Found)
(index):2790 GET http://localhost:5000/runtime-es2015.js net::ERR_ABORTED 404 (Not Found)
4(index):2790 GET http://localhost:5000/polyfills-es2015.js net::ERR_ABORTED 404 (Not Found)
16(index):2762 GET http://localhost:5000/assets/DevIntentLogo.png 404 (Not Found)
(index):2790 GET http://localhost:5000/assets/material-design-icons/MaterialIcons-Regular.woff2 net::ERR_ABORTED 404 (Not Found)
(index):2792 GET http://localhost:5000/assets/material-design-icons/MaterialIcons-Regular.woff net::ERR_ABORTED 404 (Not Found)
(index):1 GET http://localhost:5000/assets/material-design-icons/MaterialIcons-Regular.ttf net::ERR_ABORTED 404 (Not Found)
manifest.webmanifest:1 GET http://localhost:5000/manifest.webmanifest 404 (Not Found)
manifest.webmanifest:1 Manifest: Line: 1, column: 1, Syntax error.
favicon.ico:1 GET http://localhost:5000/favicon.ico 404 (Not Found)
favicon-32x32.png:1 GET http://localhost:5000/assets/favicon-32x32.png 404 (Not Found)
favicon-16x16.png:1 GET http://localhost:5000/assets/favicon-16x16.png 404 (Not Found)




Apply Settings From Markdown Frontmatter

Markdown files have frontmatter that can declare variables, essentially, to use for the post. For example: canonical_url, published true/false flag, a date for when the post should be published, the permalink the post should be accessed at, page description for the head tag, etc.
When the blog posts are generated, the front matter should be examined and the fields there should be used for each post. This is functionality that is available in Jekyll, for example, and allows for tags to be created on posts and for authors to be specified, and for posts to be "scheduled".







cli: edge case where <!doctype html> is removed from dist/static/index.html

🐞 Bug report
Description
In some edge cases, the <!doctype html> in src/index.html and dist/web/index.html is removed in the generated dist/static/index.html.
🔬 Minimal Reproduction
TBD. I reproduced this in one app, but not in a new CLI app. Investigating...
💻Your Environment
Angular Version:

Angular CLI: 9.0.0-rc.7
Node: 12.13.0
OS: darwin x64

Angular: 9.0.0-rc.7
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router, service-worker
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.6
@angular-devkit/build-angular     0.900.0-rc.7
@angular-devkit/build-optimizer   0.900.0-rc.7
@angular-devkit/build-webpack     0.900.0-rc.7
@angular-devkit/core              9.0.0-rc.6
@angular-devkit/schematics        9.0.0-rc.6
@angular/cdk                      9.0.0-rc.6
@angular/fire                     5.2.3
@angular/material                 9.0.0-rc.6
@ngtools/webpack                  9.0.0-rc.7
@schematics/angular               9.0.0-rc.6
@schematics/update                0.900.0-rc.7
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Scully Version:

    "@scullyio/init": "0.0.9",
    "@scullyio/ng-lib": "latest",
    "@scullyio/scully": "latest",

🔥 Exception or Error

Current document does not have a doctype. This may cause some Angular Material components not to behave as expected.
_checkDoctypeIsDefined @ vendor-es2015.js:84784




Logo Proposal

Hi there!

Thanks for building this ❤️. I can't wait to try the alpha version 😃

I'd like to propose a logo for this project and explain the main idea. I'm not a designer, but I really like illustration and drawing.
Logo

The logo is based on the background topic of the name Scully. An UFO seems fine for it. The font used is Montserrat Black Italic with a little modification of the final letter to give the impression of quickness.


Cover Image

The cover image uses the Angular shield and the UFO with a strong bottom light coming from the ship.


If you like this I can give the logos for this project. If you want another colors or modifications, just let me know 😉

Great work guys!



Creating opt-in opportunity to generate PWA

It sounds very naturally to add some PWA features to the generated project:

App shell
App manifest + default icons

To give the full flexibility to extend a service worker if needed, I'd offer to use Workbox library in its "node module" form.



Comments should not be included in static/index.html

🐞 Bug report
Description
The static, generated index.html file should not include comments for styles, but it currently concats all of those comments together at the top of the inlined styles.
🔬 Minimal Reproduction

Add comments in multiple Sass partials and in your styles.scss file and then build and run Scully.
Check your dist/static/index.html output for comments

💻Your Environment
Angular Version:

Angular CLI: 9.0.0-rc.6
Node: 12.13.0
OS: darwin x64

Angular: 9.0.0-rc.6
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router, service-worker
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.0-rc.6
@angular-devkit/build-angular     0.900.0-rc.6
@angular-devkit/build-optimizer   0.900.0-rc.6
@angular-devkit/build-webpack     0.900.0-rc.6
@angular-devkit/core              9.0.0-rc.6
@angular-devkit/schematics        9.0.0-rc.6
@angular/cdk                      9.0.0-rc.5
@angular/fire                     5.2.3
@angular/material                 9.0.0-rc.5
@ngtools/webpack                  9.0.0-rc.6
@schematics/angular               9.0.0-rc.6
@schematics/update                0.900.0-rc.6
rxjs                              6.5.3
typescript                        3.6.4
webpack                           4.41.2

Scully Version:

    "@scullyio/init": "0.0.8",
    "@scullyio/ng-lib": "latest",
    "@scullyio/scully": "latest",

🔥 Exception or Error
I see this kind of output
<style>/*!
 * Copyright 2013-2019 DevIntent - All Rights Reserved
 *
 * Unauthorized copying of this file, via any medium is strictly prohibited
 * without the express permission of DevIntent.
 *
 * No warranty, explicit or implicit, provided.
 * In no event shall DevIntent be liable for any claim or damages related to this code.
 */
/*!
 * Copyright 2013-2019 DevIntent - All Rights Reserved
 *
 * Unauthorized copying of this file, via any medium is strictly prohibited
 * without the express permission of DevIntent.
 *
 * No warranty, explicit or implicit, provided.
 * In no event shall DevIntent be liable for any claim or damages related to this code.
 */
/* Theme for the ripple elements.*/
/* stylelint-disable material/no-prefixes */
/* stylelint-enable */
/*!
 * Copyright 2013-2019 DevIntent - All Rights Reserved
 *
 * Unauthorized copying of this file, via any medium is strictly prohibited
 * without the express permission of DevIntent.
 *
 * No warranty, explicit or implicit, provided.
 * In no event shall DevIntent be liable for any claim or damages related to this code.
 */
/*!
 * Copyright 2013-2019 DevIntent - All Rights Reserved
 *
 * Unauthorized copying of this file, via any medium is strictly prohibited
 * without the express permission of DevIntent.
 *
 * No warranty, explicit or implicit, provided.
 * In no event shall DevIntent be liable for any claim or damages related to this code.
 */
/* Theme for the ripple elements.*/
/* stylelint-disable material/no-prefixes */
/* stylelint-enable */
/* app drawer breakpoint */
.mat-badge-content {
  font-weight: 600;
  font-size: 12px;
  font-family: Roboto, "Helvetica Neue", sans-serif;
}
...
You can see that this includes Copyrights, stylelint overrides, and style comments.
I've figured this out, but I'm still going to open this so that others who run into this can find the solution.



Add outDir to default scully.config.js

🧩 Feature request
When I run the schematic to add scully, and it generates a scully.config.js, we need to add the outDir to the scully.config.js when it is generated.
Also, we need to warn them if the provide a config that doesn't have an outDir and the warning needs to tell them where we will put the output.







scully serve not working inside windows 10

I have run ng build & npm run scully
🐞 npm run scully:serve not working or start the server
When I run npm run scully:serve, it shows starting static server..., but then it stops automatically.
Description
🔬 npm run scully:serve
💻Your Environment
Angular Version:


** Scully Version:**

0.0.8