overleaf/services/web/webpack.config.js

298 lines
9.1 KiB
JavaScript
Raw Normal View History

const fs = require('fs')
2018-01-12 06:41:02 -05:00
const path = require('path')
const webpack = require('webpack')
const CopyPlugin = require('copy-webpack-plugin')
const ManifestPlugin = require('webpack-manifest-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const PackageVersions = require('./app/src/infrastructure/PackageVersions')
2018-01-12 06:41:02 -05:00
const MODULES_PATH = path.join(__dirname, '/modules')
// Generate a hash of entry points, including modules
const entryPoints = {
[misc] merge pdf caching into main (#4033) * [frontend] WIP: pdf caching using service worker -- squashed Ref: 920fbaa00b31530f7c457a2d93bad5e553798057 Co-Authored-By: Brian Gough <brian.gough@overleaf.com> Co-Authored-By: Eric Mc Sween <eric.mcsween@overleaf.com> * [misc] add contentId into the URL for protecting PDF stream contents * [misc] gracefully handle missing ranges in serviceWorker * [misc] support PDF stream caching for anonymous users * [misc] polish header names and add URL to error message when fetch fails * [misc] polish event handler registration * [misc] limit serviceWorker scope to /project/ -- trailing slash This will block the service worker from intercepting requests on the project dashboard. * [misc] add per-request feature flag for enabling PDF stream caching * [misc] expose compile stats and timings to the frontend * [misc] serviceWorker: support clsiServerId and compileGroup url params * [misc] serviceWorker: polish header maps * [misc] serviceWorker: drop TODO for p-limit -- the browser has a queue * [misc] serviceWorker: drop verbose log message on every fetch * [misc] cut down size of diff in backend code * [misc] add test case for forwarding of pdf caching and metrics details * [misc] serviceWorker: drop all the log lines * [misc] serviceWorker: add boundary guards to the compile request regex Co-authored-by: Brian Gough <brian.gough@overleaf.com> Co-authored-by: Eric Mc Sween <eric.mcsween@overleaf.com> GitOrigin-RevId: 4b291b4a4f2866cf07bccf8ec9068f33bbfdc916
2021-05-17 05:38:18 -04:00
serviceWorker: './frontend/js/serviceWorker.js',
main: './frontend/js/main.js',
ide: './frontend/js/ide.js',
style: './frontend/stylesheets/style.less',
'ieee-style': './frontend/stylesheets/ieee-style.less',
'light-style': './frontend/stylesheets/light-style.less',
}
// Attempt to load frontend entry-points from modules, if they exist
if (fs.existsSync(MODULES_PATH)) {
fs.readdirSync(MODULES_PATH).reduce((acc, module) => {
const entryPath = path.join(MODULES_PATH, module, '/frontend/js/index.js')
if (fs.existsSync(entryPath)) {
acc[module] = entryPath
}
return acc
}, entryPoints)
}
2018-01-12 06:41:02 -05:00
module.exports = {
// Defines the "entry point(s)" for the application - i.e. the file which
// bootstraps the application
entry: entryPoints,
2018-01-12 06:41:02 -05:00
// Define where and how the bundle will be output to disk
// Note: webpack-dev-server does not write the bundle to disk, instead it is
// kept in memory for speed
output: {
path: path.join(__dirname, '/public'),
2018-01-12 06:41:02 -05:00
// By default write into js directory
filename: 'js/[name].js',
2018-01-12 06:41:02 -05:00
// Output as UMD bundle (allows main JS to import with CJS, AMD or global
// style code bundles
libraryTarget: 'umd',
// Name the exported variable from output bundle
library: ['Frontend', '[name]'],
},
2018-01-12 06:41:02 -05:00
// Define how file types are handled by webpack
module: {
rules: [
{
// Pass application JS files through babel-loader, compiling to ES5
test: /\.js$/,
// Only compile application files (npm and vendored dependencies are in
// ES5 already)
exclude: [
/node_modules\/(?!react-dnd\/)/,
path.resolve(__dirname, 'frontend/js/vendor'),
],
use: [
{
loader: 'babel-loader',
options: {
// Configure babel-loader to cache compiled output so that
// subsequent compile runs are much faster
cacheDirectory: true,
},
},
],
},
{
// Wrap PDF.js worker in a Web Worker
test: /pdf\.worker\.js$/,
use: [
{
loader: 'worker-loader',
options: {
// Write into js directory (note: customising this is not possible
// with pdfjs-dist/webpack auto loader)
name: 'js/pdfjs-worker.[hash].js',
// Override dynamically-set publicPath to explicitly use root.
// This prevents a security problem where the Worker - normally
// loaded from a CDN - has cross-origin issues, by forcing it to not
// be loaded from the CDN
publicPath: '/',
},
},
],
},
[misc] merge pdf caching into main (#4033) * [frontend] WIP: pdf caching using service worker -- squashed Ref: 920fbaa00b31530f7c457a2d93bad5e553798057 Co-Authored-By: Brian Gough <brian.gough@overleaf.com> Co-Authored-By: Eric Mc Sween <eric.mcsween@overleaf.com> * [misc] add contentId into the URL for protecting PDF stream contents * [misc] gracefully handle missing ranges in serviceWorker * [misc] support PDF stream caching for anonymous users * [misc] polish header names and add URL to error message when fetch fails * [misc] polish event handler registration * [misc] limit serviceWorker scope to /project/ -- trailing slash This will block the service worker from intercepting requests on the project dashboard. * [misc] add per-request feature flag for enabling PDF stream caching * [misc] expose compile stats and timings to the frontend * [misc] serviceWorker: support clsiServerId and compileGroup url params * [misc] serviceWorker: polish header maps * [misc] serviceWorker: drop TODO for p-limit -- the browser has a queue * [misc] serviceWorker: drop verbose log message on every fetch * [misc] cut down size of diff in backend code * [misc] add test case for forwarding of pdf caching and metrics details * [misc] serviceWorker: drop all the log lines * [misc] serviceWorker: add boundary guards to the compile request regex Co-authored-by: Brian Gough <brian.gough@overleaf.com> Co-authored-by: Eric Mc Sween <eric.mcsween@overleaf.com> GitOrigin-RevId: 4b291b4a4f2866cf07bccf8ec9068f33bbfdc916
2021-05-17 05:38:18 -04:00
{
test: /serviceWorker.js$/,
use: [
{
loader: 'worker-loader',
options: {
name: 'serviceWorker.js',
},
},
],
},
{
// Pass Less files through less-loader/css-loader/mini-css-extract-
// plugin (note: run in reverse order)
test: /\.less$/,
use: [
// Allows the CSS to be extracted to a separate .css file
{ loader: MiniCssExtractPlugin.loader },
// Resolves any CSS dependencies (e.g. url())
{ loader: 'css-loader' },
{
// Runs autoprefixer on CSS via postcss
loader: 'postcss-loader',
options: {
// Uniquely identifies the postcss plugin (required by webpack)
ident: 'postcss',
plugins: [require('autoprefixer')],
},
},
// Compiles the Less syntax to CSS
{ loader: 'less-loader' },
],
},
{
// Pass CSS files through css-loader & mini-css-extract-plugin (note: run in reverse order)
test: /\.css$/i,
use: [MiniCssExtractPlugin.loader, 'css-loader'],
},
{
// Load fonts
test: /\.(woff|woff2)$/,
use: [
{
loader: 'file-loader',
options: {
// Output to public/font
outputPath: 'fonts',
publicPath: '/fonts/',
name: '[name].[ext]',
},
},
],
},
{
// These options are necessary for handlebars to have access to helper
// methods
test: /\.handlebars$/,
loader: 'handlebars-loader',
options: {
compat: true,
knownHelpersOnly: false,
runtimePath: 'handlebars/runtime',
},
},
{
// Load translations files with custom loader, to extract and apply
// fallbacks
test: /locales\/(\w{2}(-\w{2})?)\.json$/,
use: [
{
loader: path.resolve('frontend/translations-loader.js'),
},
],
},
// Allow for injection of modules dependencies by reading contents of
// modules directory and adding necessary dependencies
{
test: path.join(__dirname, 'modules/modules-main.js'),
use: [
{
loader: 'val-loader',
},
],
},
{
test: path.join(__dirname, 'modules/modules-ide.js'),
use: [
{
loader: 'val-loader',
},
],
},
{
// Expose jQuery and $ global variables
test: require.resolve('jquery'),
use: [
{
loader: 'expose-loader',
options: 'jQuery',
},
{
loader: 'expose-loader',
options: '$',
},
],
},
{
// Expose angular global variable
test: require.resolve('angular'),
use: [
{
loader: 'expose-loader',
options: 'angular',
},
],
},
],
},
resolve: {
alias: {
// Aliases for AMD modules
// Shortcut to vendored dependencies in frontend/js/vendor/libs
libs: path.join(__dirname, 'frontend/js/vendor/libs'),
// Enables ace/ace shortcut
ace: 'ace-builds/src-noconflict',
// fineupload vendored dependency (which we're aliasing to fineuploadER
// for some reason)
fineuploader: path.join(
__dirname,
`frontend/js/vendor/libs/${PackageVersions.lib('fineuploader')}`
),
},
},
// Split out vendored dependencies that are shared between 2 or more "real
// bundles" (e.g. ide.js/main.js) as a separate "libraries" bundle and ensure
// that they are de-duplicated from the other bundles. This allows the
// libraries bundle to be independently cached (as it likely will change less
// than the other bundles)
optimization: {
splitChunks: {
cacheGroups: {
libraries: {
test: /[\\/]node_modules[\\/]|[\\/]frontend[\\/]js[\\/]vendor[\\/]libs[\\/]/,
name: 'libraries',
chunks: 'initial',
minChunks: 2,
},
},
},
},
plugins: [
// Generate a manifest.json file which is used by the backend to map the
// base filenames to the generated output filenames
new ManifestPlugin({
// Always write the manifest file to disk (even if in dev mode, where
// files are held in memory). This is needed because the server will read
// this file (from disk) when building the script's url
writeToFileEmit: true,
}),
// Prevent moment from loading (very large) locale files that aren't used
new webpack.IgnorePlugin({
resourceRegExp: /^\.\/locale$/,
contextRegExp: /moment$/,
}),
// Copy the required files for loading MathJax from MathJax NPM package
new CopyPlugin(
[
{ from: 'MathJax.js', to: 'js/libs/mathjax' },
{ from: 'config/**/*', to: 'js/libs/mathjax' },
{ from: 'extensions/**/*', to: 'js/libs/mathjax' },
{ from: 'localization/en/**/*', to: 'js/libs/mathjax' },
{ from: 'jax/output/HTML-CSS/fonts/TeX/**/*', to: 'js/libs/mathjax' },
{ from: 'jax/output/HTML-CSS/**/*.js', to: 'js/libs/mathjax' },
{ from: 'jax/element/**/*', to: 'js/libs/mathjax' },
{ from: 'jax/input/**/*', to: 'js/libs/mathjax' },
{ from: 'fonts/HTML-CSS/TeX/woff/*', to: 'js/libs/mathjax' },
],
{
context: 'node_modules/mathjax',
}
),
new CopyPlugin([
{
from: 'frontend/js/vendor/libs/sigma-master',
to: 'js/libs/sigma-master',
},
{
from: 'node_modules/ace-builds/src-min-noconflict',
to: `js/ace-${PackageVersions.version.ace}/`,
},
// Copy CMap files from pdfjs-dist package to build output. These are used
// to provide support for non-Latin characters
{ from: 'node_modules/pdfjs-dist/cmaps', to: 'js/cmaps' },
]),
],
2018-03-29 11:15:53 -04:00
}