Update babel

This commit is contained in:
LordMathis 2019-01-21 19:21:51 +01:00
parent 4d1d2a4825
commit 37e26287b8
10 changed files with 1029 additions and 425 deletions

View File

@ -1,10 +1,11 @@
{ {
"presets":[ "presets":[
"es2015", "@babel/preset-env",
"react" "@babel/react"
], ],
"plugins":[ "plugins":[
"transform-object-rest-spread", "@babel/plugin-proposal-object-rest-spread",
"transform-runtime" "@babel/plugin-transform-runtime",
"@babel/plugin-transform-template-literals"
] ]
} }

View File

@ -15,7 +15,6 @@
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"async": "^2.5.0", "async": "^2.5.0",
"axios": "^0.17.0",
"express": "^4.13.4", "express": "^4.13.4",
"front-matter": "^2.2.0", "front-matter": "^2.2.0",
"jsonfile": "^4.0.0", "jsonfile": "^4.0.0",
@ -24,27 +23,21 @@
"node-sass": "^4.9.0", "node-sass": "^4.9.0",
"react": "^16.7.0", "react": "^16.7.0",
"react-dom": "^16.7.0", "react-dom": "^16.7.0",
"react-router-dom": "^4.1.1", "react-router-dom": "^4.1.1"
"webpack-node-externals": "^1.7.2"
}, },
"devDependencies": { "devDependencies": {
"babel-cli": "^6.26.0", "@babel/core": "^7.2.2",
"babel-core": "^6.7.6", "@babel/plugin-proposal-object-rest-spread": "^7.2.0",
"babel-jest": "*", "@babel/plugin-transform-runtime": "^7.2.0",
"babel-loader": "^7.1.4", "@babel/plugin-transform-template-literals": "^7.2.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0", "@babel/preset-env": "^7.2.3",
"babel-plugin-transform-runtime": "^6.7.5", "@babel/preset-react": "^7.0.0",
"babel-polyfill": "^6.26.0", "@babel/runtime": "^7.2.0",
"babel-preset-es2015": "^6.6.0", "babel-loader": "^8.0.5",
"babel-preset-react": "^6.5.0",
"babel-preset-react-hmre": "^1.1.1",
"babel-preset-stage-0": "^6.24.1",
"babel-register": "^6.7.2",
"babel-runtime": "^6.26.0",
"clean-webpack-plugin": "^0.1.19", "clean-webpack-plugin": "^0.1.19",
"compression-webpack-plugin": "^1.1.11", "compression-webpack-plugin": "^1.1.11",
"css-loader": "^0.28.11", "css-loader": "^0.28.11",
"css-modules-require-hook": "^4.0.6", "css-modules-require-hook": "^4.2.3",
"file-loader": "^1.1.11", "file-loader": "^1.1.11",
"mini-css-extract-plugin": "^0.4.0", "mini-css-extract-plugin": "^0.4.0",
"optimize-css-assets-webpack-plugin": "^4.0.2", "optimize-css-assets-webpack-plugin": "^4.0.2",
@ -56,6 +49,7 @@
"webpack-cli": "^2.1.2", "webpack-cli": "^2.1.2",
"webpack-dev-middleware": "^3.1.3", "webpack-dev-middleware": "^3.1.3",
"webpack-hot-middleware": "^2.18.0", "webpack-hot-middleware": "^2.18.0",
"webpack-manifest-plugin": "^2.0.3" "webpack-manifest-plugin": "^2.0.4",
"webpack-node-externals": "^1.7.2"
} }
} }

View File

@ -3,13 +3,9 @@ import {hydrate} from 'react-dom';
import {BrowserRouter as Router} from 'react-router-dom'; import {BrowserRouter as Router} from 'react-router-dom';
import {App} from './components'; import {App} from './components';
const AppClient = () => ( hydrate(
<Router> <Router>
<App /> <App />
</Router> </Router>,
)
hydrate(
<AppClient />,
document.getElementById('root') document.getElementById('root')
); );

10
src/cmrh.conf.js Normal file
View File

@ -0,0 +1,10 @@
var sass = require('node-sass');
module.exports = {
generateScopedName: '[name]__[local]___[hash:base64:5]',
extensions: ['.scss', '.css'],
preprocessCss: (data, filename) => sass.renderSync({
data,
file: filename,
}).css
}

View File

@ -1,5 +1,4 @@
import React, {Component} from 'react'; import React, {Component} from 'react';
import axios from 'axios';
import {About, Blog, Home, Wrapper} from '../components'; import {About, Blog, Home, Wrapper} from '../components';
export default class MainContainer extends Component { export default class MainContainer extends Component {

View File

@ -1,5 +1,4 @@
import React, {Component} from 'react'; import React, {Component} from 'react';
import axios from 'axios';
import {Post, Wrapper, NotFoundPage} from '../components'; import {Post, Wrapper, NotFoundPage} from '../components';
export default class PostContainer extends Component { export default class PostContainer extends Component {

View File

@ -1,27 +1,18 @@
import express from 'express' import express from 'express'
import fs from 'fs' import fs from 'fs'
import {serverRender} from './utils/serverRender' import {serverRender} from './utils/serverRender'
import csshook from 'css-modules-require-hook/preset'
const port = process.env.PORT || 3000; const port = process.env.PORT || 3000;
const app = express() const app = express()
// const sass = require('node-sass');
//
// require('css-modules-require-hook')({
// generateScopedName: '[name]__[local]___[hash:base64:5]',
// extensions: ['.scss', '.css'],
// preprocessCss: (data, filename) => sass.renderSync({
// data,
// file: filename,
// }).css
// });
// const filename = './src/utils/data.json'; // const filename = './src/utils/data.json';
// const dataStub = {"posts": [], "other": []}; // const dataStub = {"posts": [], "other": []};
// fs.writeFileSync(filename, JSON.stringify(dataStub)); // fs.writeFileSync(filename, JSON.stringify(dataStub));
// require('./utils/scanner')(); // require('./utils/scanner')();
app.use('/static', express.static('public/static'))
app.get("*", serverRender); app.get("*", serverRender);
app.listen(port, function(error) { app.listen(port, function(error) {

View File

@ -4,6 +4,7 @@ import { renderToString } from 'react-dom/server'
import { StaticRouter as Router, matchPath } from 'react-router-dom' import { StaticRouter as Router, matchPath } from 'react-router-dom'
import { App } from '../components' import { App } from '../components'
import routes from './routes' import routes from './routes'
import manifest from './manifest.json'
export function serverRender(req, res, next) { export function serverRender(req, res, next) {
@ -20,9 +21,14 @@ export function serverRender(req, res, next) {
</Router>, </Router>,
); );
console.log(req.url)
console.log(markup)
console.log()
res.status(200).send(renderFullPage(markup)); res.status(200).send(renderFullPage(markup));
}).catch(next) }).catch(next)
} }
function renderFullPage(html) { function renderFullPage(html) {
@ -30,18 +36,16 @@ function renderFullPage(html) {
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Matúš Námešný</title> <title>Matúš Námešný</title>
<!-- Google Fonts --> <!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans|Open+Sans+Condensed:700&amp;subset=latin-ext" rel="stylesheet" rel="preload"> <link href="https://fonts.googleapis.com/css?family=Open+Sans|Open+Sans+Condensed:700&amp;subset=latin-ext" rel="stylesheet" rel="preload">
<!-- Font Awesome --> <!-- Font Awesome -->
<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="bundle.css" rel="stylesheet">
</head> </head>
<body> <body>
<div id="root">${html}</div> <div id="root">${html}</div>
<script src="bundle.js" async></script> <script src="static/bundle.js" async></script>
</body> </body>
</html> </html>
` `

View File

@ -18,9 +18,11 @@ const browserConfig = {
}, },
output: { output: {
path: resolve(__dirname, 'public/static'), path: resolve(__dirname, 'public/static'),
filename: '[name].[contenthash].js', filename: '[name].js',
// filename: '[name].[contenthash].js',
publicPath: '/static/' publicPath: '/static/'
}, },
devtool: "eval-source-map",
module: { module: {
rules: [ rules: [
{ {
@ -33,13 +35,13 @@ const browserConfig = {
{ {
test: /\.scss$/, test: /\.scss$/,
use: [ use: [
MiniCssExtractPlugin.loader, //MiniCssExtractPlugin.loader,
{ {
loader: 'css-loader', loader: 'css-loader',
options: { options: {
modules: true, modules: true,
importLoaders: 2, importLoaders: 2
localIdentName: '[name]__[local]___[hash:base64:5]' // localIdentName: '[name]__[local]___[hash:base64:5]'
} }
}, },
{ {
@ -63,9 +65,9 @@ const browserConfig = {
plugins: [ plugins: [
new webpack.DefinePlugin({__isBrowser__: "true"}), new webpack.DefinePlugin({__isBrowser__: "true"}),
new CleanWebpackPlugin(['public/static', 'build'], {}), new CleanWebpackPlugin(['public/static', 'build'], {}),
new MiniCssExtractPlugin({filename: '[name].[contenthash].css'}), //new MiniCssExtractPlugin(),
// new CompressionPlugin({}), // new CompressionPlugin({}),
// new ManifestPlugin(), new ManifestPlugin(),
] ]
} }
@ -94,6 +96,7 @@ const serverConfig = {
loader: 'css-loader', loader: 'css-loader',
options: { options: {
modules: true, modules: true,
exportOnlyLocals: true,
importLoaders: 2, importLoaders: 2,
localIdentName: '[name]__[local]___[hash:base64:5]' localIdentName: '[name]__[local]___[hash:base64:5]'
} }

1355
yarn.lock

File diff suppressed because it is too large Load Diff