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",
"renderPath": "./renders",
"dataPath": "./src/utils/data.json",
"files": [
"about.md", "resume.md"
]

View File

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

View File

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

View File

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

View File

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

View File

@ -1,15 +1,10 @@
import express from 'express'
import fs from 'fs'
import { serverRender } from './utils/serverRender'
require('./utils/scanner')()
const port = process.env.PORT || 3000
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.get('/favicon.ico', (req, res) => {

View File

@ -1,11 +1,12 @@
import fs from 'fs'
import data from './data.json'
import jsonfile from 'jsonfile'
import config from '../../config.json'
export function getData (path = '') {
if (path === '') {
return Promise.resolve(data)
export function getData (reqPath = '') {
if (reqPath === '') {
return readData(config.dataPath)
} else {
const fileName = '../../content/' + path
const fileName = '../../renders/' + reqPath + '.html'
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
*/
Compiler.prototype.writeData = function (callback) {
const dataPath = path.join(process.cwd(), 'src/utils/data.json')
jsonfile.writeFile(dataPath, this.data, callback)
// console.log(this.data)
jsonfile.writeFile(config.dataPath, this.data, callback)
}
module.exports = Compiler

View File

@ -3,9 +3,10 @@ const path = require('path')
const async = require('async')
const Compiler = require('./compiler')
const config = require('../../config.json')
const data = require('./data.json')
const jsonfile = require('jsonfile')
module.exports = function () {
const data = jsonfile.readFileSync(config.dataPath)
var compiler = new Compiler(data)
/**
@ -31,7 +32,13 @@ module.exports = function () {
*/
function compileFile (file, callback) {
const filePath = path.join(process.cwd(), config.contentPath, file)
compiler.addFile(filePath, false, callback)
// 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)
}
}
/**

View File

@ -1,4 +1,3 @@
// import 'babel-polyfill'
import React from 'react'
import { renderToString } from 'react-dom/server'
import { StaticRouter as Router, matchPath } from 'react-router-dom'
@ -14,11 +13,9 @@ export function serverRender (req, res, next) {
: Promise.resolve()
promise.then((data) => {
console.log(data)
const markup = renderToString(
<Router location={req.url} context={{}}>
<App data={data}/>
<Router location={req.url} context={{ data }}>
<App/>
</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">
<!-- Stylesheet -->
<link href="static/bundle.css" rel="stylesheet" rel="preload">
<!-- Initial Data -->
<script>window.__INITIAL_DATA__ = ${serialize(data)}</script>
</head>
<body>
<div id="root">${html}</div>
<script src="static/bundle.js" async></script>
<script>window.__INITIAL_DATA__ = ${serialize(data)}</script>
</body>
</html>
`

View File

@ -7,6 +7,7 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const ManifestPlugin = require('webpack-manifest-plugin')
const CleanWebpackPlugin = require('clean-webpack-plugin')
const nodeExternals = require('webpack-node-externals')
const CreateFileWebpack = require('create-file-webpack')
const browserConfig = {
mode: 'production',
@ -21,7 +22,7 @@ const browserConfig = {
// filename: '[name].[contenthash].js',
publicPath: '/static/'
},
// devtool: 'eval-source-map',
devtool: 'eval-source-map',
module: {
rules: [
{
@ -124,7 +125,15 @@ const serverConfig = {
new webpack.DefinePlugin({
__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"
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:
version "1.2.0"
resolved "https://registry.yarnpkg.com/create-hash/-/create-hash-1.2.0.tgz#889078af11a63756bcfb59bd221996be3a9ef196"
@ -5842,6 +5850,14 @@ path-type@^3.0.0:
dependencies:
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:
version "3.0.16"
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"
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"
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"
slide "^1.1.5"
write@1.0.3:
write@1.0.3, write@^1.0.3:
version "1.0.3"
resolved "https://registry.yarnpkg.com/write/-/write-1.0.3.tgz#0800e14523b923a387e415123c865616aae0f5c3"
integrity sha512-/lg70HAjtkUgWPVZhZcm+T4hkL8Zbtp1nFNOn3lRrxnlv50SRBv7cR7RqR+GMsd3hUXy9hWBo4CHTbFTcOYwig==