Skip to content

Instantly share code, notes, and snippets.

@paldepind
Created July 30, 2019 14:45
Show Gist options
  • Save paldepind/8cbc430575cd075144d291b0eff463fc to your computer and use it in GitHub Desktop.
Save paldepind/8cbc430575cd075144d291b0eff463fc to your computer and use it in GitHub Desktop.
const fs = require("fs");
const bundle = fs.readFileSync("path-to-webpack-bundle.html", "utf8");
const escaped = JSON.stringify(bundle);
const js = `export default ${escaped}`;
fs.writeFileSync("javascript-output-file.ts", js);
import { Configuration } from "webpack";
import { resolve } from "path";
import * as HtmlWebpackPlugin from "html-webpack-plugin";
import * as HtmlWebpackInlineSourcePlugin from "html-webpack-inline-source-plugin";
declare var __dirname;
const config: Configuration = {
entry: "./src/index.ts",
output: {
path: resolve(__dirname, "dist"),
filename: "bundle.js"
},
resolve: {
alias: {
fabric: resolve(__dirname, "fabric.min.js")
},
extensions: [".ts", ".js"]
},
module: {
rules: [
{ test: /\.ts$/, loader: "ts-loader" },
{ test: /\.css$/, use: ["style-loader", "css-loader"] },
{ test: /\.scss$/, use: ["style-loader", "css-loader", "sass-loader"] },
{
test: /\.(jpe?g|png|ttf|eot|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/,
use: "base64-inline-loader?limit=1000&name=[name].[ext]"
}
]
},
plugins: [
new HtmlWebpackPlugin({
meta: {
viewport: "initial-scale=1, maximum-scale=1"
},
inlineSource: ".(js|css)$"
}),
new HtmlWebpackInlineSourcePlugin()
]
};
export default config;
@fatai2
Copy link

fatai2 commented May 17, 2020

Great job!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment