diff --git a/config/webpack.common.config.js b/config/webpack.common.config.js deleted file mode 100755 index c2d341d..0000000 --- a/config/webpack.common.config.js +++ /dev/null @@ -1,16 +0,0 @@ -// This is the common Webpack config. The dev and prod Webpack configs both -// inherit config defined here. -const path = require('path'); - -module.exports = { - entry: { - segment: path.resolve(__dirname, '../src/segment.js'), - app: path.resolve(__dirname, '../src/index.jsx'), - }, - output: { - path: path.resolve(__dirname, '../dist'), - }, - resolve: { - extensions: ['.js', '.jsx'], - }, -}; diff --git a/config/webpack.dev.config.js b/config/webpack.dev.config.js deleted file mode 100755 index fae07fa..0000000 --- a/config/webpack.dev.config.js +++ /dev/null @@ -1,147 +0,0 @@ -// This is the dev Webpack config. All settings here should prefer a fast build -// time at the expense of creating larger, unoptimized bundles. -const Merge = require('webpack-merge'); -const path = require('path'); -const HtmlWebpackPlugin = require('html-webpack-plugin'); -const webpack = require('webpack'); - -const commonConfig = require('./webpack.common.config.js'); - -module.exports = Merge.smart(commonConfig, { - mode: 'development', - entry: [ - // enable react's custom hot dev client so we get errors reported in the browser - require.resolve('react-dev-utils/webpackHotDevClient'), - path.resolve(__dirname, '../src/segment.js'), - path.resolve(__dirname, '../src/index.jsx'), - ], - module: { - // Specify file-by-file rules to Webpack. Some file-types need a particular kind of loader. - rules: [ - // The babel-loader transforms newer ES2015+ syntax to older ES5 for older browsers. - // Babel is configured with the .babelrc file at the root of the project. - { - test: /\.(js|jsx)$/, - include: [ - path.resolve(__dirname, '../src'), - ], - loader: 'babel-loader', - options: { - // Caches result of loader to the filesystem. Future builds will attempt to read from the - // cache to avoid needing to run the expensive recompilation process on each run. - cacheDirectory: true, - }, - }, - // We are not extracting CSS from the javascript bundles in development because extracting - // prevents hot-reloading from working, it increases build time, and we don't care about - // flash-of-unstyled-content issues in development. - { - test: /(.scss|.css)$/, - use: [ - 'style-loader', // creates style nodes from JS strings - { - loader: 'css-loader', // translates CSS into CommonJS - options: { - sourceMap: true, - }, - }, - { - loader: 'sass-loader', // compiles Sass to CSS - options: { - sourceMap: true, - includePaths: [ - path.join(__dirname, '../node_modules'), - path.join(__dirname, '../src'), - ], - }, - }, - ], - }, - // Webpack, by default, uses the url-loader for images and fonts that are required/included by - // files it processes, which just base64 encodes them and inlines them in the javascript - // bundles. This makes the javascript bundles ginormous and defeats caching so we will use the - // file-loader instead to copy the files directly to the output directory. - { - test: /\.(woff2?|ttf|svg|eot)(\?v=\d+\.\d+\.\d+)?$/, - loader: 'file-loader', - }, - { - test: /\.(jpe?g|png|gif|ico)(\?v=\d+\.\d+\.\d+)?$/, - use: [ - 'file-loader', - { - loader: 'image-webpack-loader', - options: { - optimizationlevel: 7, - mozjpeg: { - progressive: true, - }, - gifsicle: { - interlaced: false, - }, - pngquant: { - quality: '65-90', - speed: 4, - }, - }, - }, - ], - }, - ], - }, - // Specify additional processing or side-effects done on the Webpack output bundles as a whole. - plugins: [ - // Generates an HTML file in the output directory. - new HtmlWebpackPlugin({ - inject: true, // Appends script tags linking to the webpack bundles at the end of the body - template: path.resolve(__dirname, '../public/index.html'), - }), - new webpack.EnvironmentPlugin({ - NODE_ENV: 'development', - BASE_URL: 'localhost:1994', - LMS_BASE_URL: 'http://localhost:18000', - LOGIN_URL: 'http://localhost:18000/login', - LOGOUT_URL: 'http://localhost:18000/login', - CSRF_TOKEN_API_PATH: '/csrf/api/v1/token', - REFRESH_ACCESS_TOKEN_ENDPOINT: 'http://localhost:18000/login_refresh', - DATA_API_BASE_URL: 'http://localhost:8000', - // LMS_CLIENT_ID should match the lms DOT client application id your LMS container - LMS_CLIENT_ID: 'login-service-client-id', - SEGMENT_KEY: null, - FEATURE_FLAGS: {}, - ACCESS_TOKEN_COOKIE_NAME: 'edx-jwt-cookie-header-payload', - CSRF_COOKIE_NAME: 'csrftoken', - SITE_NAME: 'edX', - MARKETING_SITE_BASE_URL: 'http://localhost:18000', - SUPPORT_URL: 'http://localhost:18000/support', - CONTACT_URL: 'http://localhost:18000/contact', - OPEN_SOURCE_URL: 'http://localhost:18000/openedx', - TERMS_OF_SERVICE_URL: 'http://localhost:18000/terms-of-service', - PRIVACY_POLICY_URL: 'http://localhost:18000/privacy-policy', - FACEBOOK_URL: 'https://www.facebook.com', - TWITTER_URL: 'https://twitter.com', - YOU_TUBE_URL: 'https://www.youtube.com', - LINKED_IN_URL: 'https://www.linkedin.com', - REDDIT_URL: 'https://www.reddit.com', - APPLE_APP_STORE_URL: 'https://www.apple.com/ios/app-store/', - GOOGLE_PLAY_URL: 'https://play.google.com/store', - ENTERPRISE_MARKETING_URL: 'http://example.com', - ENTERPRISE_MARKETING_UTM_SOURCE: 'example.com', - ENTERPRISE_MARKETING_UTM_CAMPAIGN: 'example.com Referral', - ENTERPRISE_MARKETING_FOOTER_UTM_MEDIUM: 'Footer', - }), - // when the --hot option is not passed in as part of the command - // the HotModuleReplacementPlugin has to be specified in the Webpack configuration - // https://webpack.js.org/configuration/dev-server/#devserver-hot - new webpack.HotModuleReplacementPlugin(), - ], - // This configures webpack-dev-server which serves bundles from memory and provides live - // reloading. - devServer: { - host: '0.0.0.0', - port: 1994, - historyApiFallback: true, - hot: true, - inline: true, - }, -}); diff --git a/config/webpack.prod.config.js b/config/webpack.prod.config.js deleted file mode 100755 index c22cd21..0000000 --- a/config/webpack.prod.config.js +++ /dev/null @@ -1,149 +0,0 @@ -// This is the prod Webpack config. All settings here should prefer smaller, -// optimized bundles at the expense of a longer build time. -const Merge = require('webpack-merge'); -const commonConfig = require('./webpack.common.config.js'); -const path = require('path'); -const webpack = require('webpack'); -const HtmlWebpackPlugin = require('html-webpack-plugin'); -const MiniCssExtractPlugin = require('mini-css-extract-plugin'); - -module.exports = Merge.smart(commonConfig, { - mode: 'production', - devtool: 'source-map', - output: { - filename: '[name].[chunkhash].js', - path: path.resolve(__dirname, '../dist'), - }, - module: { - // Specify file-by-file rules to Webpack. Some file-types need a particular kind of loader. - rules: [ - // The babel-loader transforms newer ES2015+ syntax to older ES5 for older browsers. - // Babel is configured with the .babelrc file at the root of the project. - { - test: /\.(js|jsx)$/, - include: [ - path.resolve(__dirname, '../src'), - ], - loader: 'babel-loader', - }, - // Webpack, by default, includes all CSS in the javascript bundles. Unfortunately, that means: - // a) The CSS won't be cached by browsers separately (a javascript change will force CSS - // re-download). b) Since CSS is applied asyncronously, it causes an ugly - // flash-of-unstyled-content. - // - // To avoid these problems, we extract the CSS from the bundles into separate CSS files that - // can be included as tags in the HTML manually. - // - // We will not do this in development because it prevents hot-reloading from working and it - // increases build time. - { - test: /(.scss|.css)$/, - use: [ - MiniCssExtractPlugin.loader, - { - loader: 'css-loader', // translates CSS into CommonJS - options: { - sourceMap: true, - minimize: true, - }, - }, - 'postcss-loader', // for autoprefixing, needs to be before the sass loader, not sure why - { - loader: 'sass-loader', // compiles Sass to CSS - options: { - sourceMap: true, - includePaths: [ - path.join(__dirname, '../node_modules'), - path.join(__dirname, '../src'), - ], - }, - }, - ], - }, - // Webpack, by default, uses the url-loader for images and fonts that are required/included by - // files it processes, which just base64 encodes them and inlines them in the javascript - // bundles. This makes the javascript bundles ginormous and defeats caching so we will use the - // file-loader instead to copy the files directly to the output directory. - { - test: /\.(woff2?|ttf|svg|eot)(\?v=\d+\.\d+\.\d+)?$/, - loader: 'file-loader', - }, - { - test: /\.(jpe?g|png|gif|ico)(\?v=\d+\.\d+\.\d+)?$/, - use: [ - 'file-loader', - { - loader: 'image-webpack-loader', - options: { - optimizationlevel: 7, - mozjpeg: { - progressive: true, - }, - gifsicle: { - interlaced: false, - }, - pngquant: { - quality: '65-90', - speed: 4, - }, - }, - }, - ], - }, - ], - }, - // New in Webpack 4. Replaces CommonChunksPlugin. Extract common modules among all chunks to one - // common chunk and extract the Webpack runtime to a single runtime chunk. - optimization: { - runtimeChunk: 'single', - splitChunks: { - chunks: 'all', - }, - }, - // Specify additional processing or side-effects done on the Webpack output bundles as a whole. - plugins: [ - // Writes the extracted CSS from each entry to a file in the output directory. - new MiniCssExtractPlugin({ - filename: '[name].[chunkhash].css', - }), - // Generates an HTML file in the output directory. - new HtmlWebpackPlugin({ - inject: true, // Appends script tags linking to the webpack bundles at the end of the body - template: path.resolve(__dirname, '../public/index.html'), - }), - new webpack.EnvironmentPlugin({ - NODE_ENV: 'production', - BASE_URL: null, - LMS_BASE_URL: null, - LOGIN_URL: null, - LOGOUT_URL: null, - CSRF_TOKEN_API_PATH: null, - REFRESH_ACCESS_TOKEN_ENDPOINT: null, - DATA_API_BASE_URL: null, - SEGMENT_KEY: null, - FEATURE_FLAGS: {}, - ACCESS_TOKEN_COOKIE_NAME: null, - CSRF_COOKIE_NAME: 'csrftoken', - NEW_RELIC_APP_ID: null, - NEW_RELIC_LICENSE_KEY: null, - SITE_NAME: null, - MARKETING_SITE_BASE_URL: null, - SUPPORT_URL: null, - CONTACT_URL: null, - OPEN_SOURCE_URL: null, - TERMS_OF_SERVICE_URL: null, - PRIVACY_POLICY_URL: null, - FACEBOOK_URL: null, - TWITTER_URL: null, - YOU_TUBE_URL: null, - LINKED_IN_URL: null, - REDDIT_URL: null, - APPLE_APP_STORE_URL: null, - GOOGLE_PLAY_URL: null, - ENTERPRISE_MARKETING_URL: null, - ENTERPRISE_MARKETING_UTM_SOURCE: null, - ENTERPRISE_MARKETING_UTM_CAMPAIGN: null, - ENTERPRISE_MARKETING_FOOTER_UTM_MEDIUM: null, - }), - ], -});