Merge pull request #2 from jasonhodges/markdown-parser

Markdown parser

.gitignore

@@ -37,4 +37,5 @@ jspm_packages
 .node_repl_history
 
 
-/dist
+/dist
+.idea

README.md

@@ -1,7 +1,8 @@
-# ngx-blog
+## ngx blog
+=======
 starter project for an Angular 2+ blog
- The idea behind this project is to create a personal, blog-type starter site. 
-
- Once finished and ready for consumption, the starter will allow any user to quickly get their site up and running with Angular, markdown parsing, publishing, building, etc. The goal is to minimize the user configuration required while leaving plenty of custiomizing. 
 
+The idea behind this project is to create a personal, blog-type starter site. 
 
+Once finished and ready for consumption, the starter will allow any user to quickly get their site up and running with Angular, markdown parsing, publishing, building, etc. The goal is to minimize the user configuration required while leaving plenty of custiomizing. 
+

config/LoopMarkdown.js

@@ -0,0 +1,37 @@
+const _ = require("lodash");
+const { RawSource } = require("webpack-sources");
+const POSTS_DIR = "./src/assets/_posts/";
+
+// https://survivejs.com/webpack/extending/plugins/
+// function LoopMarkdownPlugin(options) {
+// this.options = _.extend(
+// {
+// template: POSTS_DIR + "template.html",
+// cache: true,
+// compile: true,
+// inject: true,
+// hash: false,
+// minify: false,
+// showErrors: true
+// },
+// options
+// );
+// }
+
+class LoopMarkdownPlugin {
+ constructor(options) {
+ this.options = options;
+ }
+ apply(compiler) {
+
+ const { name } = this.options;
+
+ compiler.plugin('emit', (compilation, callback) => {
+ console.log("Loop Markdown Plugin!", this.options);
+ compilation.assets[name] = new RawSource('some raw source');
+ callback();
+ });
+ }
+}
+
+module.exports = LoopMarkdownPlugin;

config/dir-parse.js

@@ -0,0 +1,53 @@
+// https://code-maven.com/list-content-of-directory-with-nodejs
+// https://github.com/jxson/front-matter <- consider for yaml front matter parsing
+const fs = require('fs');
+const fm = require('front-matter');
+const path = require('path');
+const jsonfile = require('jsonfile');
+const postsjson = 'src/assets/_posts/posts.json';
+const dir = 'src/assets/_posts';
+
+const extFilter = 'md';
+const pathSupplied = dir;
+
+function extension(element) {
+ const extName = path.extname(element);
+ return extName === '.' + extFilter;
+}
+
+/**
+ * cycle through directory for files
+ */
+fs.readdir(pathSupplied, function (err, items) {
+ let opener = '{ "entries": ',
+ closer = ' }',
+ posts = [],
+ file = '',
+ fileContent = '',
+ content = '',
+ body = '',
+ attributes = {},
+ title = '',
+ description = '';
+ /**
+ * cycle over items, filtering for files matching extension
+ * @type {Array}
+ */
+ posts = items.filter(extension).map((item) => {
+ file = pathSupplied + '/' + item;
+ fileContent = fs.readFileSync(file, 'utf8');
+ content = fm(fileContent);
+ body = content.body;
+ attributes = content.attributes;
+ title = attributes.title;
+ description = attributes.description;
+
+ return {
+ post: content
+ };
+ });
+
+ opener += JSON.stringify(posts);
+ opener += closer;
+ fs.writeFile(postsjson, opener);
+});

config/helpers.js

@@ -1,6 +1,6 @@
-var path = require('path');
+const path = require('path');
 
-var _root = path.resolve(__dirname, '..');
+const _root = path.resolve(__dirname, '..');
 
 function root(args) {
  args = Array.prototype.slice.call(arguments, 0);

config/webpack.common.js

@@ -1,26 +1,29 @@
-var webpack = require('webpack');
-var HtmlWebpackPlugin = require('html-webpack-plugin');
-var ExtractTextPlugin = require('extract-text-webpack-plugin');
-var helpers = require('./helpers');
+const webpack = require('webpack');
+const helpers = require('./helpers');
+const marked = require('marked');
+const times = require('lodash/times');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const WebpackShellPlugin = require('webpack-shell-plugin');
+const LoopMarkdownPlugin = require('../config/LoopMarkdown');
 
 module.exports = {
  entry: {
- 'polyfills': './src/polyfills.ts',
- 'vendor': './src/vendor.ts',
- 'app': './src/main.ts'
+ 'polyfills': helpers.root('src', 'polyfills.ts'),
+ 'vendor': helpers.root('src', 'vendor.ts'),
+ 'app': helpers.root('src', 'main.ts')
  },
-
  resolve: {
  extensions: ['.ts', '.js']
  },
-
  module: {
- rules: [{
+ rules: [
+ {
  test: /\.ts$/,
  loaders: [{
-  loader: 'awesome-typescript-loader',
-  options: { configFileName: helpers.root('src', 'tsconfig.json') }
-  },
+ loader: 'awesome-typescript-loader',
+ options: { configFileName: helpers.root('src', 'tsconfig.json') }
+ },
  'angular2-template-loader'
  ]
  },
@@ -33,12 +36,13 @@ module.exports = {
  loader: 'file-loader?name=assets/[name].[hash].[ext]'
  },
  {
- test: /\.css$/,
- exclude: helpers.root('src', 'app'),
- loader: ExtractTextPlugin.extract({
- fallbackLoader: 'style-loader',
- loader: 'css-loader?sourceMap'
- })
+ test: /\.json$/,
+ loader: 'file-loader?name=assets/[name].[hash].json'
+ },
+ {
+ test: /\.scss$/,
+ exclude: /node_modules/,
+ loaders: ['raw-loader', 'sass-loader']
  },
  {
  test: /\.css$/,
@@ -62,7 +66,12 @@ module.exports = {
  }),
 
  new HtmlWebpackPlugin({
- template: 'src/index.html'
+ template: helpers.root('src', 'index.html')
+ }),
+
+ new WebpackShellPlugin({
+ onBuildStart: ['node ./config/dir-parse.js']
  })
+
  ]
 };

config/webpack.dev.js

@@ -1,7 +1,7 @@
-var webpackMerge = require('webpack-merge');
-var ExtractTextPlugin = require('extract-text-webpack-plugin');
-var commonConfig = require('./webpack.common.js');
-var helpers = require('./helpers');
+const helpers = require('./helpers');
+const webpackMerge = require('webpack-merge');
+const WebpackShellPlugin = require('webpack-shell-plugin');
+const commonConfig = require('./webpack.common.js');
 
 module.exports = webpackMerge(commonConfig, {
  devtool: 'cheap-module-eval-source-map',
@@ -12,11 +12,11 @@ module.exports = webpackMerge(commonConfig, {
  filename: '[name].js',
  chunkFilename: '[id].chunk.js'
  },
-
  plugins: [
- new ExtractTextPlugin('[name].css')
+ new WebpackShellPlugin({
+ onBuildStart: ['node ./config/dir-parse.js']
+ })
  ],
-
  devServer: {
  historyApiFallback: true,
  stats: 'minimal'

config/webpack.prod.js

@@ -1,8 +1,11 @@
-var webpack = require('webpack');
-var webpackMerge = require('webpack-merge');
-var ExtractTextPlugin = require('extract-text-webpack-plugin');
-var commonConfig = require('./webpack.common.js');
-var helpers = require('./helpers');
+const webpack = require('webpack');
+const helpers = require('./helpers');
+const marked = require('marked');
+const times = require('lodash/times');
+const webpackMerge = require('webpack-merge');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const commonConfig = require('./webpack.common.js');
 
 const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
 
@@ -23,7 +26,6 @@ module.exports = webpackMerge(commonConfig, {
  keep_fnames: true
  }
  }),
- new ExtractTextPlugin('[name].[hash].css'),
  new webpack.DefinePlugin({
  'process.env': {
  'ENV': JSON.stringify(ENV)

package.json

@@ -4,25 +4,26 @@
  "author": "Jason Hodges <[email protected]>",
  "license": "MIT",
  "scripts": {
- "test:once": "karma start karma.conf.js --single-run",
  "build": "rimraf dist && webpack --config config/webpack.prod.js --bail",
- "serve": "lite-server -c=bs-config.json",
- "prestart": "npm run build",
- "start": "webpack-dev-server --inline --progress --port 8080",
- "pretest": "npm run build",
- "test": "karma start karma.webpack.conf.js",
- "pretest:once": "npm run build",
- "build:watch": "tsc -p src/ -w",
- "build:upgrade": "tsc",
- "serve:upgrade": "http-server",
  "build:aot": "ngc -p tsconfig-aot.json && rollup -c rollup-config.js",
- "serve:aot": "lite-server -c bs-config.aot.json",
  "build:babel": "babel src -d src --extensions \".es6\" --source-maps",
+ "build:upgrade": "tsc",
+ "build:watch": "tsc -p src/ -w",
+ "commit": "git-cz",
  "copy-dist-files": "node ./copy-dist-files.js",
+ "e2e": "ng e2e",
  "i18n": "ng-xi18n",
  "lint": "tslint ./src/**/*.ts -t verbose",
  "ng": "ng",
- "e2e": "ng e2e"
+ "prestart": "npm run build",
+ "pretest": "npm run build",
+ "pretest:once": "npm run build",
+ "serve": "lite-server -c=bs-config.json",
+ "serve:aot": "lite-server -c bs-config.aot.json",
+ "serve:upgrade": "http-server",
+ "start": "webpack-dev-server --inline --progress --port 8080",
+ "test": "karma start karma.webpack.conf.js",
+ "test:once": "karma start karma.conf.js --single-run"
  },
  "keywords": [],
  "dependencies": {
@@ -39,23 +40,36 @@
  "@angular/router": "~4.3.1",
  "@angular/tsc-wrapped": "~4.3.1",
  "@angular/upgrade": "~4.3.1",
+ "@angularclass/hmr": "^2.1.3",
+ "@angularclass/hmr-loader": "^3.0.4",
  "angular-in-memory-web-api": "~0.3.2",
  "core-js": "^2.4.1",
+ "front-matter": "^2.1.2",
+ "highlightjs": "^9.10.0",
+ "jsonfile": "^3.0.1",
+ "marked": "^0.3.6",
+ "ng2-markdown-to-html": "^1.3.0",
+ "prismjs": "^1.6.0",
+ "reflect-metadata": "^0.1.10",
  "rxjs": "^5.1.0",
  "systemjs": "0.19.39",
+ "ts-helpers": "^1.1.2",
  "zone.js": "^0.8.4"
  },
  "devDependencies": {
  "@angular/cli": "^1.2.0",
+ "@types/angular": "^1.5.16",
  "@types/angular-animate": "^1.5.5",
  "@types/angular-cookies": "^1.4.2",
  "@types/angular-mocks": "^1.5.5",
  "@types/angular-resource": "^1.5.6",
  "@types/angular-route": "^1.3.2",
  "@types/angular-sanitize": "^1.3.3",
- "@types/angular": "^1.5.16",
+ "@types/highlight.js": "^9.1.9",
  "@types/jasmine": "2.5.36",
+ "@types/marked": "^0.3.0",
  "@types/node": "^6.0.45",
+ "@types/prismjs": "^1.6.2",
  "angular2-template-loader": "^0.6.0",
  "awesome-typescript-loader": "^3.0.4",
  "babel-cli": "^6.16.0",
@@ -64,40 +78,46 @@
  "canonical-path": "0.0.2",
  "concurrently": "^3.0.0",
  "css-loader": "^0.26.1",
+ "cz-conventional-changelog": "^2.0.0",
  "extract-text-webpack-plugin": "2.0.0-beta.5",
  "file-loader": "^0.9.0",
  "html-loader": "^0.4.3",
  "html-webpack-plugin": "^2.16.1",
  "http-server": "^0.9.0",
- "jasmine-core": "~2.4.1",
  "jasmine": "~2.4.1",
+ "jasmine-core": "~2.4.1",
+ "karma": "^1.3.0",
  "karma-chrome-launcher": "^2.0.0",
  "karma-cli": "^1.0.1",
- "karma-jasmine-html-reporter": "^0.2.2",
  "karma-jasmine": "^1.0.2",
+ "karma-jasmine-html-reporter": "^0.2.2",
  "karma-phantomjs-launcher": "^1.0.2",
  "karma-sourcemap-loader": "^0.3.7",
  "karma-webpack": "^2.0.1",
- "karma": "^1.3.0",
  "lite-server": "^2.2.2",
- "lodash": "^4.16.2",
+ "lodash": "^4.17.4",
+ "markdown-loader": "^2.0.1",
+ "node-sass": "^4.5.3",
  "null-loader": "^0.1.1",
  "phantomjs-prebuilt": "^2.1.7",
  "protractor": "~5.1.0",
  "raw-loader": "^0.5.1",
  "rimraf": "^2.5.4",
+ "rollup": "^0.41.6",
  "rollup-plugin-commonjs": "^8.0.2",
  "rollup-plugin-node-resolve": "2.0.0",
  "rollup-plugin-uglify": "^1.0.1",
- "rollup": "^0.41.6",
+ "sass-loader": "^6.0.6",
  "source-map-explorer": "^1.3.2",
  "style-loader": "^0.13.1",
  "ts-node": "~3.0.4",
  "tslint": "^3.15.1",
  "typescript": "~2.3.2",
+ "webpack": "2.2.1",
  "webpack-dev-server": "2.4.1",
  "webpack-merge": "^3.0.0",
- "webpack": "2.2.1"
+ "webpack-shell-plugin": "^0.5.0",
+ "webpack-sources": "^1.0.1"
  },
  "repository": {}
-}
+}