initialized webpack and babel

2026-02-06 06:08:10 +00:00 · 2021-05-28 18:37:31 +02:00
commit 888c76829c
8 changed files with 4677 additions and 0 deletions
--- a/.babelrc
+++ b/.babelrc
@@ -0,0 +1,21 @@
+{
+    "presets": [
+        "@babel/preset-env",
+        "@babel/preset-typescript"
+    ],
+    "plugins": [
+        [
+            "@babel/plugin-proposal-decorators",
+            {
+                "legacy": true
+            }
+        ],
+        "@babel/proposal-object-rest-spread",
+        [
+            "@babel/proposal-class-properties",
+            {
+                "loose": true
+            }
+        ]
+    ]
+}
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,2 @@
+node_modules
+.env
--- a/package.json
+++ b/package.json
@@ -0,0 +1,28 @@
+{
+  "name": "wallet-web",
+  "version": "1.0.0",
+  "main": "index.js",
+  "author": "Fran Jurmanović <fjurma12@outlook.com>",
+  "license": "MIT",
+  "scripts": {
+    "start": "webpack serve --mode development --hot",
+    "build": "webpack --mode production"
+  },
+  "dependencies": {
+    "@babel/core": "^7.14.3",
+    "@babel/plugin-proposal-class-properties": "^7.13.0",
+    "@babel/plugin-proposal-decorators": "^7.14.2",
+    "@babel/plugin-proposal-object-rest-spread": "^7.14.2",
+    "@babel/preset-env": "^7.14.2",
+    "@babel/preset-typescript": "^7.13.0",
+    "babel-loader": "^8.2.2",
+    "babel-polyfill": "^6.26.0",
+    "connect-history-api-fallback": "^1.6.0",
+    "html-webpack-plugin": "^5.3.1",
+    "webpack": "^5.38.1",
+    "webpack-dev-server": "^3.11.2"
+  },
+  "devDependencies": {
+    "webpack-cli": "^4.7.0"
+  }
+}
--- a/src/index.html
+++ b/src/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Wallet Web</title>
+</head>
+<body>
+    <app-main></app-main>
+</body>
+</html>
--- a/src/index.ts
+++ b/src/index.ts
@@ -0,0 +1,3 @@
+const main = document.querySelector("app-main");
+
+if (main) main.innerHTML = "Works";
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -0,0 +1,15 @@
+{
+    "compilerOptions": {
+        "target": "es5",
+        "module": "commonjs",
+        "lib": [
+            "dom",
+            "es2015",
+            "es2016"
+        ],
+        "moduleResolution": "node",
+        "esModuleInterop": true,
+        "allowSyntheticDefaultImports": true,
+        "experimentalDecorators": true,
+    }
+}
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -0,0 +1,55 @@
+const path = require('path');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+
+module.exports = {
+    entry: {
+        app: ['babel-polyfill', './src/index']
+    },
+    optimization: {
+        runtimeChunk: 'single',
+        splitChunks: {
+            chunks: 'all',
+            cacheGroups: {
+                commons: {
+                    test: /[\\/]node_modules[\\/]/,
+                    name: "vendor",
+                    chunks: "initial",
+                    minSize: 200000,
+                    maxSize: 400000
+                },
+                styles: {
+                    name: 'styles',
+                    test: /\.css$/,
+                    chunks: 'all'
+                }
+            }
+        }
+    },
+    output: {
+        path: path.join(__dirname, 'public'),
+        filename: '[name].[contenthash].js',
+        publicPath: '/'
+    },
+    module: {
+        rules: [
+            {
+                test: /\.(js|ts)?$/,
+                exclude: /node_modules/,
+                use: {
+                    loader: 'babel-loader'
+                }
+            },
+        ]
+    },
+    plugins: [
+        new HtmlWebpackPlugin({
+            template: './src/index.html'
+        }),
+    ],
+    resolve: {
+        extensions: ['.js', '.ts']
+    },
+    devServer: {
+        historyApiFallback: true,
+    }   
+}
--- a/yarn.lock
+++ b/yarn.lock