Skip to content

Instantly share code, notes, and snippets.

@harshaktg
harshaktg / package.json
Created September 8, 2020 10:16
Webpack Dev server
...
"scripts": {
"dev": "webpack --mode development",
"start": "webpack-dev-server --mode development --open"
}
...
@harshaktg
harshaktg / webpack.config.js
Created September 8, 2020 10:12
Webpack HTML Config
const HTMLWebpackPlugin = require('html-webpack-plugin')
const path = require('path')
module.exports = {
plugins: [
new HTMLWebpackPlugin({
template: path.resolve(__dirname, "source", "index.html")
})
]
};
@harshaktg
harshaktg / webpack.config.js
Created September 8, 2020 09:48
Webpack output
const path = require('path')
module.exports = {
output: { path: path.resolve(__dirname, "build"), filename: "main.js" }
};
@harshaktg
harshaktg / webpack.config.js
Created September 8, 2020 09:41
Webpack entry alternate
const path = require('path')
module.exports = {
entry: { index: path.resolve(__dirname, "source", "index.js") }
};
@harshaktg
harshaktg / webpack.config.js
Created September 8, 2020 09:34
Webpack config entry
module.exports = {
"entry": "./source/index.js"
}
@harshaktg
harshaktg / package.json
Created September 8, 2020 07:26
Webpack Starter package.json
{
"name": "webpack-demo",
"version": "1.0.0",
"description": "To demonstrate the working of Webpack",
"main": "index.js",
"scripts": {
"dev": "webpack --mode development"
},
"author": "Harsha Vardhan",
"license": "ISC",
@harshaktg
harshaktg / package.json
Created September 5, 2020 15:17
Package json MFE Single SPA
{
"name": "microfrontends-example",
"version": "1.0.0",
"description": "To demonstrate micro frontends using single SPA",
"main": "index.js",
"scripts": {
"start": "webpack-dev-server --open",
"build": "webpack --config webpack.config.js -p"
},
"author": "Harsha Vardhan",
@harshaktg
harshaktg / index.html
Created September 5, 2020 14:57
Index file MFE Single SPA
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MicroFrontEnds example</title>
<script src="./store.js"></script>
</head>
<body>
<div id="react"></div>
@harshaktg
harshaktg / singleSPA.config.js
Created September 5, 2020 14:52
singleSPA Config MFE
import { registerApplication, start } from 'single-spa'
registerApplication(
'vue',
() => import('./components/vue/index.js'),
() => location.pathname === "/vue" || location.pathname === "/" ? true : false
);
registerApplication(
'react',
@harshaktg
harshaktg / index.js
Created September 5, 2020 13:07
Vanilla JS MFE Single SPA
import singleSpaHtml from 'single-spa-html';
const htmlLifecycles = singleSpaHtml({
template: `<h1>Hello from VanillaJS</h1>
<h2>Counter value is <span id="counterVal"></span></h2>
<input type="button" onclick="window.myapp.incrementor()" value="+"></input>
<input type="button" onclick="window.myapp.decrementor()" value="-"></input>
`,
})
htmlLifecycles.originalMount = htmlLifecycles.mount;