github.com/argoproj/argo-cd@v1.8.7/ui/src/app/webpack.config.js (about) 1 'use strict;'; 2 3 const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin'); 4 const CopyWebpackPlugin = require('copy-webpack-plugin'); 5 const HtmlWebpackPlugin = require('html-webpack-plugin'); 6 const GoogleFontsPlugin = require('@beyonk/google-fonts-webpack-plugin'); 7 const webpack = require('webpack'); 8 const path = require('path'); 9 10 const isProd = process.env.NODE_ENV === 'production'; 11 console.log(`Bundling in ${isProd ? 'production' : 'development'} mode...`); 12 13 const proxyConf = { 14 'target': process.env.ARGOCD_API_URL || 'http://localhost:8080', 15 'secure': false, 16 }; 17 18 const config = { 19 entry: './src/app/index.tsx', 20 output: { 21 filename: '[name].[hash].js', 22 chunkFilename: '[name].[hash].chunk.js', 23 path: __dirname + '/../../dist/app' 24 }, 25 26 devtool: 'source-map', 27 28 resolve: { 29 extensions: ['.ts', '.tsx', '.js', '.json'] 30 }, 31 32 module: { 33 rules: [ 34 { 35 test: /\.tsx?$/, 36 loaders: [ ...( isProd ? [] : ['react-hot-loader/webpack']), `ts-loader?allowTsInNodeModules=true&configFile=${path.resolve('./src/app/tsconfig.json')}`] 37 }, { 38 enforce: 'pre', 39 exclude: [ 40 /node_modules\/react-paginate/, 41 /node_modules\/monaco-editor/, 42 ], 43 test: /\.js$/, 44 loaders: [...(isProd ? ['babel-loader'] : []), 'source-map-loader'], 45 }, { 46 test: /\.scss$/, 47 loader: 'style-loader!raw-loader!sass-loader' 48 }, { 49 test: /\.css$/, 50 loader: 'style-loader!raw-loader' 51 }, 52 ] 53 }, 54 node: { 55 fs: 'empty', 56 }, 57 plugins: [ 58 new webpack.DefinePlugin({ 59 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development'), 60 SYSTEM_INFO: JSON.stringify({ 61 version: process.env.ARGO_VERSION || 'latest', 62 }), 63 }), 64 new HtmlWebpackPlugin({ template: 'src/app/index.html' }), 65 new CopyWebpackPlugin({ 66 patterns: [{ 67 from: 'src/assets', to: 'assets' 68 }, { 69 from: 'node_modules/argo-ui/src/assets', to: 'assets' 70 }, { 71 from: 'node_modules/@fortawesome/fontawesome-free/webfonts', to: 'assets/fonts' 72 }, { 73 from: 'node_modules/redoc/bundles/redoc.standalone.js', to: 'assets/scripts/redoc.standalone.js' 74 }] 75 }), 76 new MonacoWebpackPlugin({ 77 // https://github.com/microsoft/monaco-editor-webpack-plugin#options 78 languages: [ 'yaml' ] 79 }), 80 new GoogleFontsPlugin({ 81 // config: https://github.com/beyonk-adventures/google-fonts-webpack-plugin 82 // the upstream version of this plugin is not compatible with webpack 4 so we use this fork 83 fonts: [{ 84 family: 'Heebo', 85 variants: [ '300', '400', '500', '700' ] 86 }], 87 // This works by downloading the fonts at bundle time and adding those font-faces to 'fonts.css'. 88 name: 'fonts', 89 filename: 'fonts.css', 90 // local: false in dev prevents pulling fonts on each code change 91 // https://github.com/gabiseabra/google-fonts-webpack-plugin/issues/2 92 local: isProd, 93 path: 'assets/fonts/google-fonts' 94 }) 95 ], 96 devServer: { 97 historyApiFallback: { 98 disableDotRule: true 99 }, 100 port: 4000, 101 host: process.env.ARGOCD_E2E_YARN_HOST || 'localhost', 102 proxy: { 103 '/api': proxyConf, 104 '/auth': proxyConf, 105 '/swagger-ui': proxyConf, 106 '/swagger.json': proxyConf, 107 } 108 } 109 }; 110 111 module.exports = config;