Fix data.json loading

This commit is contained in:
LordMathis 2019-02-18 21:18:55 +01:00
parent 6f2a2a5a9e
commit 23ffc87168
12 changed files with 90 additions and 43 deletions

View File

@ -10,6 +10,7 @@
}, },
"contentPath": "./content", "contentPath": "./content",
"renderPath": "./renders", "renderPath": "./renders",
"dataPath": "./src/utils/data.json",
"files": [ "files": [
"about.md", "resume.md" "about.md", "resume.md"
] ]

View File

@ -40,6 +40,7 @@
"babel-loader": "^8.0.5", "babel-loader": "^8.0.5",
"clean-webpack-plugin": "^0.1.19", "clean-webpack-plugin": "^0.1.19",
"compression-webpack-plugin": "^1.1.11", "compression-webpack-plugin": "^1.1.11",
"create-file-webpack": "^1.0.2",
"css-loader": "^0.28.11", "css-loader": "^0.28.11",
"css-modules-require-hook": "^4.2.3", "css-modules-require-hook": "^4.2.3",
"eslint": "^5.14.0", "eslint": "^5.14.0",

View File

@ -1,18 +1,23 @@
import React, {Component} from 'react'; import React, { Component } from 'react'
import {Spinner, Header, Navbar} from '.'; import PropTypes from 'prop-types'
import '../static/stylesheets/globals.scss'; import { Spinner, Header, Navbar } from '.'
import contentStyle from '../static/stylesheets/content.scss'; import '../static/stylesheets/globals.scss'
import styles from './Post.scss'; import contentStyle from '../static/stylesheets/content.scss'
import styles from './Post.scss'
export default class Post extends Component { export default class Post extends Component {
render() { static propTypes = {
isLoading: PropTypes.bool.isRequired,
post: PropTypes.object.isRequired
}
render () {
if (this.props.isLoading) { if (this.props.isLoading) {
return ( return (
<div className={contentStyle.contentWrapper}> <div className={contentStyle.contentWrapper}>
<Spinner/> <Spinner/>
</div> </div>
); )
} }
return ( return (

View File

@ -4,18 +4,26 @@ import { About, Blog, Home, Wrapper } from '../components'
export default class MainContainer extends Component { export default class MainContainer extends Component {
static propTypes = { static propTypes = {
data: PropTypes.object.isRequired staticContext: PropTypes.object
} }
constructor () { constructor (props) {
super() super(props)
let data
if (__isBrowser__) {
data = window.__INITIAL_DATA__
delete window.__INITIAL_DATA__
} else {
data = props.staticContext.data
}
this.state = { this.state = {
isLoadingBlog: true, isLoadingBlog: !data.posts,
isLoadingAbout: true isLoadingAbout: !data.about,
about: data.about,
posts: data.posts
} }
console.log(this.props.data)
} }
render () { render () {

View File

@ -14,8 +14,6 @@ export default class PostContainer extends Component {
isLoading: true, isLoading: true,
error: false error: false
} }
console.log(this.props.data)
} }
render () { render () {

View File

@ -1,15 +1,10 @@
import express from 'express' import express from 'express'
import fs from 'fs'
import { serverRender } from './utils/serverRender' import { serverRender } from './utils/serverRender'
require('./utils/scanner')()
const port = process.env.PORT || 3000 const port = process.env.PORT || 3000
const app = express() const app = express()
const filename = './src/utils/data.json'
const dataStub = { 'posts': [], 'other': [] }
fs.writeFileSync(filename, JSON.stringify(dataStub))
require('./utils/scanner')()
app.use('/static', express.static('public/static')) app.use('/static', express.static('public/static'))
app.get('/favicon.ico', (req, res) => { app.get('/favicon.ico', (req, res) => {

View File

@ -1,11 +1,12 @@
import fs from 'fs' import fs from 'fs'
import data from './data.json' import jsonfile from 'jsonfile'
import config from '../../config.json'
export function getData (path = '') { export function getData (reqPath = '') {
if (path === '') { if (reqPath === '') {
return Promise.resolve(data) return readData(config.dataPath)
} else { } else {
const fileName = '../../content/' + path const fileName = '../../renders/' + reqPath + '.html'
return readFile(fileName) return readFile(fileName)
} }
}; };
@ -17,3 +18,11 @@ function readFile (fileName, type) {
}) })
}) })
} }
function readData (dataPath) {
return new Promise(function (resolve, reject) {
jsonfile.readFile(dataPath, (err, data) => {
err ? reject(err) : resolve(data)
})
})
}

View File

@ -128,8 +128,8 @@ Compiler.prototype.addFile = function (filepath, isPost, callback) {
* Writes updated data to the data file * Writes updated data to the data file
*/ */
Compiler.prototype.writeData = function (callback) { Compiler.prototype.writeData = function (callback) {
const dataPath = path.join(process.cwd(), 'src/utils/data.json') // console.log(this.data)
jsonfile.writeFile(dataPath, this.data, callback) jsonfile.writeFile(config.dataPath, this.data, callback)
} }
module.exports = Compiler module.exports = Compiler

View File

@ -3,9 +3,10 @@ const path = require('path')
const async = require('async') const async = require('async')
const Compiler = require('./compiler') const Compiler = require('./compiler')
const config = require('../../config.json') const config = require('../../config.json')
const data = require('./data.json') const jsonfile = require('jsonfile')
module.exports = function () { module.exports = function () {
const data = jsonfile.readFileSync(config.dataPath)
var compiler = new Compiler(data) var compiler = new Compiler(data)
/** /**
@ -31,8 +32,14 @@ module.exports = function () {
*/ */
function compileFile (file, callback) { function compileFile (file, callback) {
const filePath = path.join(process.cwd(), config.contentPath, file) const filePath = path.join(process.cwd(), config.contentPath, file)
// config.files contains list of file names which are not considered blog posts
if (config.files.indexOf(file) === -1) {
compiler.addFile(filePath, true, callback)
} else {
compiler.addFile(filePath, false, callback) compiler.addFile(filePath, false, callback)
} }
}
/** /**
* Writes updated data into the data file * Writes updated data into the data file

View File

@ -1,4 +1,3 @@
// import 'babel-polyfill'
import React from 'react' import React from 'react'
import { renderToString } from 'react-dom/server' import { renderToString } from 'react-dom/server'
import { StaticRouter as Router, matchPath } from 'react-router-dom' import { StaticRouter as Router, matchPath } from 'react-router-dom'
@ -14,11 +13,9 @@ export function serverRender (req, res, next) {
: Promise.resolve() : Promise.resolve()
promise.then((data) => { promise.then((data) => {
console.log(data)
const markup = renderToString( const markup = renderToString(
<Router location={req.url} context={{}}> <Router location={req.url} context={{ data }}>
<App data={data}/> <App/>
</Router> </Router>
) )
@ -38,11 +35,12 @@ function renderFullPage (html, data) {
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" rel="preload" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous"> <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" rel="preload" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous">
<!-- Stylesheet --> <!-- Stylesheet -->
<link href="static/bundle.css" rel="stylesheet" rel="preload"> <link href="static/bundle.css" rel="stylesheet" rel="preload">
<!-- Initial Data -->
<script>window.__INITIAL_DATA__ = ${serialize(data)}</script>
</head> </head>
<body> <body>
<div id="root">${html}</div> <div id="root">${html}</div>
<script src="static/bundle.js" async></script> <script src="static/bundle.js" async></script>
<script>window.__INITIAL_DATA__ = ${serialize(data)}</script>
</body> </body>
</html> </html>
` `

View File

@ -7,6 +7,7 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const ManifestPlugin = require('webpack-manifest-plugin') const ManifestPlugin = require('webpack-manifest-plugin')
const CleanWebpackPlugin = require('clean-webpack-plugin') const CleanWebpackPlugin = require('clean-webpack-plugin')
const nodeExternals = require('webpack-node-externals') const nodeExternals = require('webpack-node-externals')
const CreateFileWebpack = require('create-file-webpack')
const browserConfig = { const browserConfig = {
mode: 'production', mode: 'production',
@ -21,7 +22,7 @@ const browserConfig = {
// filename: '[name].[contenthash].js', // filename: '[name].[contenthash].js',
publicPath: '/static/' publicPath: '/static/'
}, },
// devtool: 'eval-source-map', devtool: 'eval-source-map',
module: { module: {
rules: [ rules: [
{ {
@ -124,7 +125,15 @@ const serverConfig = {
new webpack.DefinePlugin({ new webpack.DefinePlugin({
__isBrowser__: 'false' __isBrowser__: 'false'
}), }),
new MiniCssExtractPlugin() new MiniCssExtractPlugin(),
new CreateFileWebpack({
path: './src/utils/',
fileName: 'data.json',
content: JSON.stringify({
'posts': [],
'other': []
})
})
] ]
} }

View File

@ -2313,6 +2313,14 @@ create-ecdh@^4.0.0:
bn.js "^4.1.0" bn.js "^4.1.0"
elliptic "^6.0.0" elliptic "^6.0.0"
create-file-webpack@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/create-file-webpack/-/create-file-webpack-1.0.2.tgz#c206474fe15a6aab12e2a278a7798d244befff0b"
integrity sha512-+J6kQTE+Wcobc6gHP8E2zmoeIC+J+p6IXqjFrzoxCl1VYlimWoincPUABAhODuXAJGrZcNZ/Up0PTqq1ISiwvA==
dependencies:
path "^0.12.7"
write "^1.0.3"
create-hash@^1.1.0, create-hash@^1.1.2: create-hash@^1.1.0, create-hash@^1.1.2:
version "1.2.0" version "1.2.0"
resolved "https://registry.yarnpkg.com/create-hash/-/create-hash-1.2.0.tgz#889078af11a63756bcfb59bd221996be3a9ef196" resolved "https://registry.yarnpkg.com/create-hash/-/create-hash-1.2.0.tgz#889078af11a63756bcfb59bd221996be3a9ef196"
@ -5842,6 +5850,14 @@ path-type@^3.0.0:
dependencies: dependencies:
pify "^3.0.0" pify "^3.0.0"
path@^0.12.7:
version "0.12.7"
resolved "https://registry.yarnpkg.com/path/-/path-0.12.7.tgz#d4dc2a506c4ce2197eb481ebfcd5b36c0140b10f"
integrity sha1-1NwqUGxM4hl+tIHr/NWzbAFAsQ8=
dependencies:
process "^0.11.1"
util "^0.10.3"
pbkdf2@^3.0.3: pbkdf2@^3.0.3:
version "3.0.16" version "3.0.16"
resolved "https://registry.yarnpkg.com/pbkdf2/-/pbkdf2-3.0.16.tgz#7404208ec6b01b62d85bf83853a8064f8d9c2a5c" resolved "https://registry.yarnpkg.com/pbkdf2/-/pbkdf2-3.0.16.tgz#7404208ec6b01b62d85bf83853a8064f8d9c2a5c"
@ -6216,7 +6232,7 @@ process-nextick-args@^2.0.0, process-nextick-args@~2.0.0:
version "2.0.0" version "2.0.0"
resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.0.tgz#a37d732f4271b4ab1ad070d35508e8290788ffaa" resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.0.tgz#a37d732f4271b4ab1ad070d35508e8290788ffaa"
process@^0.11.10: process@^0.11.1, process@^0.11.10:
version "0.11.10" version "0.11.10"
resolved "https://registry.yarnpkg.com/process/-/process-0.11.10.tgz#7332300e840161bda3e69a1d1d91a7d4bc16f182" resolved "https://registry.yarnpkg.com/process/-/process-0.11.10.tgz#7332300e840161bda3e69a1d1d91a7d4bc16f182"
@ -8069,7 +8085,7 @@ write-file-atomic@^1.2.0:
imurmurhash "^0.1.4" imurmurhash "^0.1.4"
slide "^1.1.5" slide "^1.1.5"
write@1.0.3: write@1.0.3, write@^1.0.3:
version "1.0.3" version "1.0.3"
resolved "https://registry.yarnpkg.com/write/-/write-1.0.3.tgz#0800e14523b923a387e415123c865616aae0f5c3" resolved "https://registry.yarnpkg.com/write/-/write-1.0.3.tgz#0800e14523b923a387e415123c865616aae0f5c3"
integrity sha512-/lg70HAjtkUgWPVZhZcm+T4hkL8Zbtp1nFNOn3lRrxnlv50SRBv7cR7RqR+GMsd3hUXy9hWBo4CHTbFTcOYwig== integrity sha512-/lg70HAjtkUgWPVZhZcm+T4hkL8Zbtp1nFNOn3lRrxnlv50SRBv7cR7RqR+GMsd3hUXy9hWBo4CHTbFTcOYwig==