Remove webpack
This commit is contained in:
parent
54413ceb8e
commit
059342ceb8
18 changed files with 59 additions and 3882 deletions
34
package.json
34
package.json
|
@ -39,13 +39,6 @@
|
|||
"not dead"
|
||||
],
|
||||
"dependencies": {
|
||||
"@babel/core": "^7.20.12",
|
||||
"@babel/plugin-transform-react-inline-elements": "^7.18.6",
|
||||
"@babel/plugin-transform-runtime": "^7.19.6",
|
||||
"@babel/preset-env": "^7.20.2",
|
||||
"@babel/preset-react": "^7.18.6",
|
||||
"@babel/preset-typescript": "^7.18.6",
|
||||
"@babel/runtime": "^7.20.13",
|
||||
"@emoji-mart/data": "^1.1.2",
|
||||
"@floating-ui/react": "^0.24.0",
|
||||
"@fontsource/inter": "^4.5.1",
|
||||
|
@ -89,14 +82,10 @@
|
|||
"@types/seedrandom": "^3.0.2",
|
||||
"@types/semver": "^7.3.9",
|
||||
"@types/uuid": "^9.0.0",
|
||||
"@types/webpack-assets-manifest": "^5.1.0",
|
||||
"@types/webpack-bundle-analyzer": "^4.6.0",
|
||||
"@types/webpack-deadcode-plugin": "^0.1.2",
|
||||
"@vitejs/plugin-react": "^4.0.4",
|
||||
"autoprefixer": "^10.4.2",
|
||||
"axios": "^1.2.2",
|
||||
"axios-mock-adapter": "^1.21.1",
|
||||
"babel-loader": "^9.0.0",
|
||||
"babel-plugin-preval": "^5.1.0",
|
||||
"babel-plugin-react-intl": "^7.5.20",
|
||||
"blurhash": "^2.0.0",
|
||||
|
@ -104,10 +93,8 @@
|
|||
"bowser": "^2.11.0",
|
||||
"browserslist": "^4.16.6",
|
||||
"clsx": "^1.2.1",
|
||||
"copy-webpack-plugin": "^11.0.0",
|
||||
"core-js": "^3.27.2",
|
||||
"cryptocurrency-icons": "^0.18.1",
|
||||
"css-loader": "^6.7.1",
|
||||
"cssnano": "^5.1.10",
|
||||
"detect-passive-events": "^2.0.0",
|
||||
"dotenv": "^16.0.0",
|
||||
|
@ -116,14 +103,10 @@
|
|||
"escape-html": "^1.0.3",
|
||||
"exif-js": "^2.3.0",
|
||||
"flexsearch": "^0.7.31",
|
||||
"fork-ts-checker-webpack-plugin": "^8.0.0",
|
||||
"graphemesplit": "^2.4.4",
|
||||
"html-webpack-harddisk-plugin": "^2.0.0",
|
||||
"html-webpack-plugin": "^5.5.0",
|
||||
"http-link-header": "^1.0.2",
|
||||
"immer": "^9.0.19",
|
||||
"immutable": "^4.2.1",
|
||||
"imports-loader": "^4.0.0",
|
||||
"intersection-observer": "^0.12.2",
|
||||
"intl-messageformat": "9.13.0",
|
||||
"intl-messageformat-parser": "^6.0.0",
|
||||
|
@ -136,8 +119,6 @@
|
|||
"mini-css-extract-plugin": "^2.6.0",
|
||||
"nostr-tools": "^1.14.2",
|
||||
"path-browserify": "^1.0.1",
|
||||
"postcss": "^8.4.14",
|
||||
"postcss-loader": "^7.0.0",
|
||||
"process": "^0.11.10",
|
||||
"punycode": "^2.1.1",
|
||||
"qrcode.react": "^3.1.0",
|
||||
|
@ -170,15 +151,11 @@
|
|||
"redux-thunk": "^2.2.0",
|
||||
"reselect": "^4.0.0",
|
||||
"resize-observer-polyfill": "^1.5.1",
|
||||
"sass": "^1.20.3",
|
||||
"sass-loader": "^13.0.0",
|
||||
"seedrandom": "^3.0.5",
|
||||
"semver": "^7.3.8",
|
||||
"stringz": "^2.0.0",
|
||||
"substring-trie": "^1.0.2",
|
||||
"terser-webpack-plugin": "^5.2.3",
|
||||
"tiny-queue": "^0.2.1",
|
||||
"ts-loader": "^9.3.0",
|
||||
"ts-node": "^10.9.1",
|
||||
"tslib": "^2.3.1",
|
||||
"twemoji": "https://github.com/twitter/twemoji#v14.0.2",
|
||||
|
@ -191,28 +168,18 @@
|
|||
"vite-plugin-html": "^3.2.0",
|
||||
"vite-plugin-require": "^1.1.10",
|
||||
"vite-plugin-static-copy": "^0.17.0",
|
||||
"webpack": "^5.72.1",
|
||||
"webpack-assets-manifest": "^5.1.0",
|
||||
"webpack-bundle-analyzer": "^4.5.0",
|
||||
"webpack-cli": "^5.0.0",
|
||||
"webpack-deadcode-plugin": "^0.1.16",
|
||||
"webpack-merge": "^5.8.0",
|
||||
"wicg-inert": "^3.1.1",
|
||||
"zod": "^3.21.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/eslint-parser": "^7.19.1",
|
||||
"@gitbeaker/node": "^35.8.0",
|
||||
"@jedmao/redux-mock-store": "^3.0.5",
|
||||
"@pmmmwh/react-refresh-webpack-plugin": "^0.5.10",
|
||||
"@tailwindcss/aspect-ratio": "^0.4.2",
|
||||
"@testing-library/jest-dom": "^5.16.5",
|
||||
"@testing-library/react-hooks": "^8.0.1",
|
||||
"@testing-library/user-event": "^14.4.3",
|
||||
"@typescript-eslint/eslint-plugin": "^5.15.0",
|
||||
"@typescript-eslint/parser": "^5.15.0",
|
||||
"babel-jest": "^29.4.1",
|
||||
"babel-plugin-transform-require-context": "^0.1.1",
|
||||
"cross-env": "^7.0.3",
|
||||
"danger": "^11.0.7",
|
||||
"eslint": "^8.0.0",
|
||||
|
@ -237,7 +204,6 @@
|
|||
"stylelint-config-standard-scss": "^6.1.0",
|
||||
"tailwindcss": "^3.3.1",
|
||||
"ts-jest": "^29.0.0",
|
||||
"webpack-dev-server": "^4.9.1",
|
||||
"yargs": "^17.6.2"
|
||||
},
|
||||
"resolutions": {
|
||||
|
|
|
@ -1,7 +0,0 @@
|
|||
module.exports = ({ env }) => ({
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
cssnano: env === 'production' ? {} : false,
|
||||
},
|
||||
});
|
|
@ -1,22 +0,0 @@
|
|||
import dotenv from 'dotenv';
|
||||
|
||||
import type { Configuration } from 'webpack';
|
||||
|
||||
dotenv.config();
|
||||
|
||||
const { NODE_ENV } = process.env;
|
||||
|
||||
let configuration: Configuration = {};
|
||||
|
||||
switch (NODE_ENV) {
|
||||
case 'development':
|
||||
case 'production':
|
||||
case 'test':
|
||||
configuration = require(`./webpack/${NODE_ENV}`).default;
|
||||
break;
|
||||
default:
|
||||
console.error('ERROR: NODE_ENV must be set to either `development`, `test`, or `production`.');
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
export default configuration;
|
|
@ -1,32 +0,0 @@
|
|||
import { join } from 'path';
|
||||
import { env } from 'process';
|
||||
|
||||
const {
|
||||
FE_SUBDIRECTORY,
|
||||
FE_BUILD_DIR,
|
||||
} = require(join(__dirname, '..', 'app', 'soapbox', 'build-config'));
|
||||
|
||||
const settings = {
|
||||
source_path: 'app',
|
||||
public_root_path: FE_BUILD_DIR,
|
||||
test_root_path: `${FE_BUILD_DIR}-test`,
|
||||
cache_path: 'tmp/cache',
|
||||
resolved_paths: [],
|
||||
extensions: [ '.js', '.jsx', '.cjs', '.mjs', '.ts', '.tsx', '.sass', '.scss', '.css', '.module.sass', '.module.scss', '.module.css', '.png', '.svg', '.gif', '.jpeg', '.jpg' ],
|
||||
};
|
||||
|
||||
const outputDir = env.NODE_ENV === 'test' ? settings.test_root_path : settings.public_root_path;
|
||||
|
||||
const output = {
|
||||
path: join(__dirname, '..', outputDir, FE_SUBDIRECTORY),
|
||||
};
|
||||
|
||||
const exportEnv = {
|
||||
NODE_ENV: env.NODE_ENV,
|
||||
};
|
||||
|
||||
export {
|
||||
settings,
|
||||
exportEnv as env,
|
||||
output,
|
||||
};
|
|
@ -1,127 +0,0 @@
|
|||
// Note: You must restart bin/webpack-dev-server for changes to take effect
|
||||
console.log('Running in development mode'); // eslint-disable-line no-console
|
||||
|
||||
import { join } from 'path';
|
||||
|
||||
import ReactRefreshWebpackPlugin from '@pmmmwh/react-refresh-webpack-plugin';
|
||||
import { merge } from 'webpack-merge';
|
||||
|
||||
import sharedConfig from './shared';
|
||||
|
||||
import type { Configuration } from 'webpack';
|
||||
import type { Configuration as DevServerConfiguration, ProxyConfigMap } from 'webpack-dev-server';
|
||||
|
||||
const watchOptions: Configuration['watchOptions'] = {};
|
||||
|
||||
const {
|
||||
DEVSERVER_URL,
|
||||
BACKEND_URL,
|
||||
PATRON_URL,
|
||||
PROXY_HTTPS_INSECURE,
|
||||
} = process.env;
|
||||
|
||||
const DEFAULTS = {
|
||||
DEVSERVER_URL: 'http://localhost:3036',
|
||||
PATRON_URL: 'http://localhost:3037',
|
||||
};
|
||||
|
||||
const { FE_SUBDIRECTORY } = require(join(__dirname, '..', 'app', 'soapbox', 'build-config'));
|
||||
|
||||
const backendEndpoints = [
|
||||
'/api',
|
||||
'/pleroma',
|
||||
'/nodeinfo',
|
||||
'/socket',
|
||||
'/oauth',
|
||||
'/.well-known/webfinger',
|
||||
'/static',
|
||||
'/main/ostatus',
|
||||
'/ostatus_subscribe',
|
||||
'/favicon.png',
|
||||
];
|
||||
|
||||
const makeProxyConfig = (): ProxyConfigMap => {
|
||||
const secureProxy = PROXY_HTTPS_INSECURE !== 'true';
|
||||
|
||||
const proxyConfig: ProxyConfigMap = {};
|
||||
proxyConfig['/api/patron'] = {
|
||||
target: PATRON_URL || DEFAULTS.PATRON_URL,
|
||||
secure: secureProxy,
|
||||
changeOrigin: true,
|
||||
};
|
||||
backendEndpoints.map(endpoint => {
|
||||
proxyConfig[endpoint] = {
|
||||
target: BACKEND_URL,
|
||||
secure: secureProxy,
|
||||
changeOrigin: true,
|
||||
};
|
||||
});
|
||||
return proxyConfig;
|
||||
};
|
||||
|
||||
if (process.env.VAGRANT) {
|
||||
// If we are in Vagrant, we can't rely on inotify to update us with changed
|
||||
// files, so we must poll instead. Here, we poll every second to see if
|
||||
// anything has changed.
|
||||
watchOptions.poll = 1000;
|
||||
}
|
||||
|
||||
const devServerUrl = (() => {
|
||||
try {
|
||||
return new URL(DEVSERVER_URL || DEFAULTS.DEVSERVER_URL);
|
||||
} catch {
|
||||
return new URL(DEFAULTS.DEVSERVER_URL);
|
||||
}
|
||||
})();
|
||||
|
||||
const devServer: DevServerConfiguration = {
|
||||
compress: true,
|
||||
host: devServerUrl.hostname,
|
||||
port: devServerUrl.port,
|
||||
https: devServerUrl.protocol === 'https:',
|
||||
hot: true,
|
||||
allowedHosts: 'all',
|
||||
historyApiFallback: {
|
||||
disableDotRule: true,
|
||||
index: join(FE_SUBDIRECTORY, '/'),
|
||||
},
|
||||
headers: {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
},
|
||||
client: {
|
||||
overlay: true,
|
||||
},
|
||||
static: {
|
||||
serveIndex: true,
|
||||
},
|
||||
proxy: makeProxyConfig(),
|
||||
};
|
||||
|
||||
const configuration: Configuration = {
|
||||
mode: 'development',
|
||||
cache: true,
|
||||
devtool: 'source-map',
|
||||
|
||||
stats: {
|
||||
preset: 'errors-warnings',
|
||||
errorDetails: true,
|
||||
},
|
||||
|
||||
output: {
|
||||
pathinfo: true,
|
||||
},
|
||||
|
||||
watchOptions: Object.assign(
|
||||
{},
|
||||
{ ignored: '**/node_modules/**' },
|
||||
watchOptions,
|
||||
),
|
||||
|
||||
plugins: [
|
||||
new ReactRefreshWebpackPlugin(),
|
||||
],
|
||||
|
||||
devServer,
|
||||
};
|
||||
|
||||
export default merge<Configuration>(sharedConfig, configuration);
|
|
@ -1,14 +0,0 @@
|
|||
import { resolve } from 'path';
|
||||
|
||||
import type { LoaderContext } from 'webpack';
|
||||
|
||||
/**
|
||||
* Forces recompile whenever the current commit changes.
|
||||
* Useful for generating the version hash in the UI.
|
||||
*/
|
||||
function loader(this: LoaderContext<{}>, content: string) {
|
||||
this.addDependency(resolve(__dirname, '../../.git/logs/HEAD'));
|
||||
this.callback(undefined, content);
|
||||
}
|
||||
|
||||
export default loader;
|
|
@ -1,154 +0,0 @@
|
|||
// Note: You must restart bin/webpack-dev-server for changes to take effect
|
||||
console.log('Running in production mode'); // eslint-disable-line no-console
|
||||
|
||||
import { join } from 'path';
|
||||
|
||||
// @ts-ignore: No types available.
|
||||
import OfflinePlugin from '@lcdp/offline-plugin';
|
||||
import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
|
||||
import { merge } from 'webpack-merge';
|
||||
|
||||
import sharedConfig from './shared';
|
||||
|
||||
import type { Configuration } from 'webpack';
|
||||
|
||||
const { FE_SUBDIRECTORY } = require(join(__dirname, '..', 'app', 'soapbox', 'build-config'));
|
||||
const joinPublicPath = (...paths: string[]) => join(FE_SUBDIRECTORY, ...paths);
|
||||
|
||||
const configuration: Configuration = {
|
||||
mode: 'production',
|
||||
devtool: 'source-map',
|
||||
stats: 'errors-warnings',
|
||||
bail: true,
|
||||
|
||||
output: {
|
||||
filename: 'packs/js/[name]-[chunkhash].js',
|
||||
chunkFilename: 'packs/js/[name]-[chunkhash].chunk.js',
|
||||
hotUpdateChunkFilename: 'packs/js/[id]-[contenthash].hot-update.js',
|
||||
},
|
||||
|
||||
optimization: {
|
||||
minimize: true,
|
||||
},
|
||||
|
||||
plugins: [
|
||||
// Generates report.html
|
||||
new BundleAnalyzerPlugin({
|
||||
analyzerMode: 'static',
|
||||
openAnalyzer: false,
|
||||
logLevel: 'silent',
|
||||
}),
|
||||
new OfflinePlugin({
|
||||
autoUpdate: true,
|
||||
responseStrategy: 'network-first',
|
||||
caches: {
|
||||
main: [':rest:'],
|
||||
additional: [
|
||||
':externals:',
|
||||
'packs/images/32-*.png', // used in emoji-mart
|
||||
'packs/icons/*.svg',
|
||||
],
|
||||
optional: [
|
||||
'**/locale_*.js', // don't fetch every locale; the user only needs one
|
||||
'**/*.chunk.js', // only cache chunks when needed
|
||||
'**/*.chunk.css',
|
||||
'**/*.woff2', // the user may have system-fonts enabled
|
||||
// images can be cached on-demand
|
||||
'**/*.png',
|
||||
'**/*.svg',
|
||||
],
|
||||
},
|
||||
externals: [
|
||||
joinPublicPath('packs/emoji/1f602.svg'), // used for emoji picker dropdown
|
||||
|
||||
// Default emoji reacts
|
||||
joinPublicPath('packs/emoji/1f44d.svg'), // Thumbs up
|
||||
joinPublicPath('packs/emoji/2764.svg'), // Heart
|
||||
joinPublicPath('packs/emoji/1f606.svg'), // Laughing
|
||||
joinPublicPath('packs/emoji/1f62e.svg'), // Surprised
|
||||
joinPublicPath('packs/emoji/1f622.svg'), // Crying
|
||||
joinPublicPath('packs/emoji/1f629.svg'), // Weary
|
||||
joinPublicPath('packs/emoji/1f621.svg'), // Angry (Spinster)
|
||||
],
|
||||
excludes: [
|
||||
'**/*.gz',
|
||||
'**/*.map',
|
||||
'**/*.LICENSE.txt',
|
||||
'stats.json',
|
||||
'report.html',
|
||||
'instance/**/*',
|
||||
// any browser that supports ServiceWorker will support woff2
|
||||
'**/*.eot',
|
||||
'**/*.ttf',
|
||||
'**/*-webfont-*.svg',
|
||||
'**/*.woff',
|
||||
// Sounds return a 206 causing sw.js to crash
|
||||
// https://stackoverflow.com/a/66335638
|
||||
'**/*.ogg',
|
||||
'**/*.oga',
|
||||
'**/*.mp3',
|
||||
'404.html',
|
||||
'assets-manifest.json',
|
||||
// It would be nice to serve these, but they bloat up sw.js
|
||||
'packs/images/crypto/**/*',
|
||||
'packs/emoji/**/*',
|
||||
],
|
||||
ServiceWorker: {
|
||||
cacheName: 'soapbox',
|
||||
entry: join(__dirname, '../app/soapbox/service-worker/entry.ts'),
|
||||
events: true,
|
||||
minify: true,
|
||||
},
|
||||
cacheMaps: [{
|
||||
// NOTE: This function gets stringified by OfflinePlugin, so don't try
|
||||
// moving it anywhere else or making it depend on anything outside it!
|
||||
// https://github.com/NekR/offline-plugin/blob/master/docs/cache-maps.md
|
||||
match: (url: URL) => {
|
||||
const { pathname } = url;
|
||||
|
||||
const backendRoutes = [
|
||||
'/.well-known',
|
||||
'/activities',
|
||||
'/admin',
|
||||
'/api',
|
||||
'/auth',
|
||||
'/inbox',
|
||||
'/instance',
|
||||
'/internal',
|
||||
'/main/ostatus',
|
||||
'/manifest.json',
|
||||
'/media',
|
||||
'/nodeinfo',
|
||||
'/oauth',
|
||||
'/objects',
|
||||
'/ostatus_subscribe',
|
||||
'/pghero',
|
||||
'/phoenix',
|
||||
'/pleroma',
|
||||
'/proxy',
|
||||
'/relay',
|
||||
'/sidekiq',
|
||||
'/socket',
|
||||
'/static',
|
||||
'/unsubscribe',
|
||||
'/images',
|
||||
'/favicon.ico',
|
||||
'/favicon.png',
|
||||
'/apple-touch-icon.png',
|
||||
'/browserconfig.xml',
|
||||
'/robots.txt',
|
||||
'/report.html',
|
||||
];
|
||||
|
||||
if (backendRoutes.some(path => pathname.startsWith(path)) || pathname.endsWith('/embed') || pathname.endsWith('.rss')) {
|
||||
return url;
|
||||
}
|
||||
},
|
||||
requestTypes: ['navigate'],
|
||||
}],
|
||||
safeToUseOptionalCaches: true,
|
||||
}),
|
||||
],
|
||||
};
|
||||
|
||||
export default merge<Configuration>(sharedConfig, configuration);
|
|
@ -1,80 +0,0 @@
|
|||
// Asset modules
|
||||
// https://webpack.js.org/guides/asset-modules/
|
||||
|
||||
import { resolve } from 'path';
|
||||
|
||||
import type { RuleSetRule } from 'webpack';
|
||||
|
||||
// These are processed in reverse-order
|
||||
// We use the name 'packs' instead of 'assets' for legacy reasons
|
||||
const rules: RuleSetRule[] = [{
|
||||
test: /\.(png|svg)/,
|
||||
type: 'asset/resource',
|
||||
include: [
|
||||
resolve('app', 'assets', 'images'),
|
||||
resolve('node_modules', 'emoji-datasource'),
|
||||
resolve('node_modules', 'leaflet'),
|
||||
],
|
||||
generator: {
|
||||
filename: 'packs/images/[name]-[contenthash:8][ext]',
|
||||
},
|
||||
}, {
|
||||
test: /\.(ttf|eot|svg|woff|woff2)/,
|
||||
type: 'asset/resource',
|
||||
include: [
|
||||
resolve('app', 'assets', 'fonts'),
|
||||
resolve('node_modules', 'fork-awesome'),
|
||||
resolve('node_modules', 'line-awesome'),
|
||||
resolve('node_modules', '@fontsource'),
|
||||
],
|
||||
generator: {
|
||||
filename: 'packs/fonts/[name]-[contenthash:8][ext]',
|
||||
},
|
||||
}, {
|
||||
test: /\.(ogg|oga|mp3)/,
|
||||
type: 'asset/resource',
|
||||
include: resolve('app', 'assets', 'sounds'),
|
||||
generator: {
|
||||
filename: 'packs/sounds/[name]-[contenthash:8][ext]',
|
||||
},
|
||||
}, {
|
||||
test: /\.svg$/,
|
||||
type: 'asset/resource',
|
||||
include: resolve('node_modules', 'twemoji'),
|
||||
generator: {
|
||||
filename: 'packs/emoji/[name]-[contenthash:8][ext]',
|
||||
},
|
||||
}, {
|
||||
test: /\.svg$/,
|
||||
type: 'asset/resource',
|
||||
include: resolve('app', 'assets', 'icons'),
|
||||
generator: {
|
||||
filename: 'packs/icons/[name]-[contenthash:8][ext]',
|
||||
},
|
||||
}, {
|
||||
test: /\.svg$/,
|
||||
type: 'asset/resource',
|
||||
include: resolve('node_modules', 'bootstrap-icons'),
|
||||
generator: {
|
||||
filename: 'packs/icons/[name]-[contenthash:8][ext]',
|
||||
},
|
||||
}, {
|
||||
test: /\.svg$/,
|
||||
type: 'asset/resource',
|
||||
include: [
|
||||
resolve('node_modules', '@tabler'),
|
||||
resolve('custom', 'modules', '@tabler'),
|
||||
],
|
||||
generator: {
|
||||
filename: 'packs/icons/[name]-[contenthash:8][ext]',
|
||||
},
|
||||
}, {
|
||||
test: /\.svg$/,
|
||||
type: 'asset/resource',
|
||||
include: resolve('node_modules', 'cryptocurrency-icons'),
|
||||
generator: {
|
||||
filename: 'packs/images/crypto/[name]-[contenthash:8][ext]',
|
||||
},
|
||||
}];
|
||||
|
||||
export default rules;
|
|
@ -1,24 +0,0 @@
|
|||
import { resolve } from 'path';
|
||||
|
||||
import { env } from '../configuration';
|
||||
|
||||
import type { RuleSetRule } from 'webpack';
|
||||
|
||||
// This is a hack, used to force build-config @preval to recompile
|
||||
// https://github.com/kentcdodds/babel-plugin-preval/issues/19
|
||||
|
||||
const rule: RuleSetRule = {
|
||||
test: resolve(__dirname, '../../app/soapbox/build-config.js'),
|
||||
use: [
|
||||
{
|
||||
loader: 'babel-loader',
|
||||
options: {
|
||||
cacheDirectory: false,
|
||||
cacheCompression: env.NODE_ENV === 'production',
|
||||
compact: env.NODE_ENV === 'production',
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
export default rule;
|
|
@ -1,24 +0,0 @@
|
|||
import { resolve } from 'path';
|
||||
|
||||
import { env } from '../configuration';
|
||||
|
||||
import type { RuleSetRule } from 'webpack';
|
||||
|
||||
// This is a hack, used in conjunction with rules/git-refresh.js
|
||||
// https://github.com/kentcdodds/babel-plugin-preval/issues/19
|
||||
|
||||
const rule: RuleSetRule = {
|
||||
test: resolve(__dirname, '../../app/soapbox/utils/code.js'),
|
||||
use: [
|
||||
{
|
||||
loader: 'babel-loader',
|
||||
options: {
|
||||
cacheDirectory: false,
|
||||
cacheCompression: env.NODE_ENV === 'production',
|
||||
compact: env.NODE_ENV === 'production',
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
export default rule;
|
|
@ -1,36 +0,0 @@
|
|||
import { join, resolve } from 'path';
|
||||
|
||||
import { env, settings } from '../configuration';
|
||||
|
||||
import type { RuleSetRule } from 'webpack';
|
||||
|
||||
const isDevelopment = process.env.NODE_ENV === 'development';
|
||||
|
||||
const rule: RuleSetRule = {
|
||||
test: /\.(js|jsx|cjs|mjs|ts|tsx)$/,
|
||||
include: [
|
||||
settings.source_path,
|
||||
...settings.resolved_paths,
|
||||
].map(p => resolve(p)),
|
||||
exclude: /node_modules/,
|
||||
use: [
|
||||
{
|
||||
loader: 'ts-loader',
|
||||
options: {
|
||||
// disable type checker - we will use it in fork plugin
|
||||
transpileOnly: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
loader: 'babel-loader',
|
||||
options: {
|
||||
cacheDirectory: join(settings.cache_path, 'babel-loader'),
|
||||
cacheCompression: env.NODE_ENV === 'production',
|
||||
compact: env.NODE_ENV === 'production',
|
||||
plugins: isDevelopment ? ['react-refresh/babel'] : [],
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
export default rule;
|
|
@ -1,32 +0,0 @@
|
|||
import MiniCssExtractPlugin from 'mini-css-extract-plugin';
|
||||
|
||||
import type { RuleSetRule } from 'webpack';
|
||||
|
||||
const rule: RuleSetRule = {
|
||||
test: /\.s?css$/i,
|
||||
use: [
|
||||
MiniCssExtractPlugin.loader,
|
||||
{
|
||||
loader: 'css-loader',
|
||||
options: {
|
||||
sourceMap: true,
|
||||
importLoaders: 2,
|
||||
},
|
||||
},
|
||||
{
|
||||
loader: 'postcss-loader',
|
||||
options: {
|
||||
sourceMap: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
loader: 'sass-loader',
|
||||
options: {
|
||||
implementation: require('sass'),
|
||||
sourceMap: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
export default rule;
|
|
@ -1,13 +0,0 @@
|
|||
import { resolve } from 'path';
|
||||
|
||||
import type { RuleSetRule } from 'webpack';
|
||||
|
||||
/** Recompile code.js whenever git changes. */
|
||||
const rule: RuleSetRule = {
|
||||
test: resolve(__dirname, '../../app/soapbox/utils/code.js'),
|
||||
use: {
|
||||
loader: resolve(__dirname, '../loaders/git-loader.ts'),
|
||||
},
|
||||
};
|
||||
|
||||
export default rule;
|
|
@ -1,23 +0,0 @@
|
|||
import assets from './assets';
|
||||
import babel from './babel';
|
||||
import buildConfig from './babel-build-config';
|
||||
import git from './babel-git';
|
||||
import css from './css';
|
||||
import gitRefresh from './git-refresh';
|
||||
import nodeModules from './node-modules';
|
||||
|
||||
import type { RuleSetRule } from 'webpack';
|
||||
|
||||
// Webpack loaders are processed in reverse order
|
||||
// https://webpack.js.org/concepts/loaders/#loader-features
|
||||
const rules: RuleSetRule[] = [
|
||||
...assets,
|
||||
css,
|
||||
nodeModules,
|
||||
babel,
|
||||
git,
|
||||
gitRefresh,
|
||||
buildConfig,
|
||||
];
|
||||
|
||||
export default rules;
|
|
@ -1,29 +0,0 @@
|
|||
import { join } from 'path';
|
||||
|
||||
import { env, settings } from '../configuration';
|
||||
|
||||
import type { RuleSetRule } from 'webpack';
|
||||
|
||||
const rule: RuleSetRule = {
|
||||
test: /\.(js|mjs)$/,
|
||||
include: /node_modules/,
|
||||
exclude: [
|
||||
/@babel(?:\/|\\{1,2})runtime/,
|
||||
/\bcore-js\b/,
|
||||
/\bwebpack\/buildin\b/,
|
||||
],
|
||||
use: [
|
||||
{
|
||||
loader: 'babel-loader',
|
||||
options: {
|
||||
babelrc: false,
|
||||
cacheDirectory: join(settings.cache_path, 'babel-loader-node-modules'),
|
||||
cacheCompression: env.NODE_ENV === 'production',
|
||||
compact: false,
|
||||
sourceMaps: false,
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
export default rule;
|
|
@ -1,171 +0,0 @@
|
|||
// Note: You must restart bin/webpack-dev-server for changes to take effect
|
||||
|
||||
import fs from 'fs';
|
||||
import { join, resolve } from 'path';
|
||||
|
||||
import CopyPlugin from 'copy-webpack-plugin';
|
||||
import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
|
||||
import HtmlWebpackHarddiskPlugin from 'html-webpack-harddisk-plugin';
|
||||
import HtmlWebpackPlugin from 'html-webpack-plugin';
|
||||
import MiniCssExtractPlugin from 'mini-css-extract-plugin';
|
||||
import webpack, { Configuration } from 'webpack';
|
||||
import AssetsManifestPlugin from 'webpack-assets-manifest';
|
||||
import DeadCodePlugin from 'webpack-deadcode-plugin';
|
||||
|
||||
import { env, settings, output } from './configuration';
|
||||
import rules from './rules';
|
||||
|
||||
const { FE_SUBDIRECTORY, FE_INSTANCE_SOURCE_DIR } = require(join(__dirname, '..', 'app', 'soapbox', 'build-config'));
|
||||
|
||||
/** Return file as string, or return empty string. */
|
||||
const readFile = (filename: string) => {
|
||||
try {
|
||||
return fs.readFileSync(filename, 'utf8');
|
||||
} catch {
|
||||
return '';
|
||||
}
|
||||
};
|
||||
|
||||
const makeHtmlConfig = (params = {}): HtmlWebpackPlugin.Options => {
|
||||
const defaults: HtmlWebpackPlugin.Options = {
|
||||
template: 'app/index.ejs',
|
||||
chunksSortMode: 'manual',
|
||||
chunks: ['common', 'locale_en', 'application', 'styles'],
|
||||
alwaysWriteToDisk: true,
|
||||
minify: {
|
||||
collapseWhitespace: true,
|
||||
removeComments: false,
|
||||
removeRedundantAttributes: true,
|
||||
removeScriptTypeAttributes: true,
|
||||
removeStyleLinkTypeAttributes: true,
|
||||
useShortDoctype: true,
|
||||
},
|
||||
templateParameters: {
|
||||
snippets: readFile(resolve('custom/snippets.html')),
|
||||
},
|
||||
};
|
||||
|
||||
return Object.assign(defaults, params);
|
||||
};
|
||||
|
||||
const configuration: Configuration = {
|
||||
entry: {
|
||||
application: resolve('app/soapbox/main.tsx'),
|
||||
},
|
||||
|
||||
output: {
|
||||
filename: 'packs/js/[name].js',
|
||||
chunkFilename: 'packs/js/[name].chunk.js',
|
||||
hotUpdateChunkFilename: 'packs/js/[id].hot-update.js',
|
||||
path: output.path,
|
||||
publicPath: FE_SUBDIRECTORY || '/',
|
||||
},
|
||||
|
||||
optimization: {
|
||||
chunkIds: 'total-size',
|
||||
moduleIds: 'size',
|
||||
runtimeChunk: {
|
||||
name: 'common',
|
||||
},
|
||||
splitChunks: {
|
||||
cacheGroups: {
|
||||
default: false,
|
||||
defaultVendors: false,
|
||||
common: {
|
||||
name: 'common',
|
||||
chunks: 'all',
|
||||
minChunks: 2,
|
||||
minSize: 0,
|
||||
test: /^(?!.*[\\\/]node_modules[\\\/]react-intl[\\\/]).+$/,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
module: {
|
||||
rules,
|
||||
},
|
||||
|
||||
plugins: [
|
||||
new webpack.EnvironmentPlugin(JSON.parse(JSON.stringify(env))),
|
||||
new webpack.ProvidePlugin({
|
||||
process: 'process/browser',
|
||||
}),
|
||||
new ForkTsCheckerWebpackPlugin({ typescript: { memoryLimit: 8192 } }),
|
||||
new MiniCssExtractPlugin({
|
||||
filename: 'packs/css/[name]-[contenthash:8].css',
|
||||
chunkFilename: 'packs/css/[name]-[contenthash:8].chunk.css',
|
||||
}),
|
||||
// @ts-ignore
|
||||
new AssetsManifestPlugin({
|
||||
integrity: false,
|
||||
entrypoints: true,
|
||||
writeToDisk: true,
|
||||
publicPath: true,
|
||||
}),
|
||||
// https://github.com/MQuy/webpack-deadcode-plugin
|
||||
// @ts-ignore
|
||||
new DeadCodePlugin({
|
||||
patterns: [
|
||||
'app/**/*',
|
||||
],
|
||||
exclude: [
|
||||
'**/*.test.*',
|
||||
'**/__*__/*',
|
||||
'**/(LICENSE|README|COPYING)(.md|.txt)?',
|
||||
// This file is imported with @preval
|
||||
'app/soapbox/features/emoji/emoji-map.json',
|
||||
],
|
||||
}),
|
||||
// https://github.com/jantimon/html-webpack-plugin#options
|
||||
new HtmlWebpackPlugin(makeHtmlConfig()),
|
||||
new HtmlWebpackPlugin(makeHtmlConfig({ filename: '404.html' })),
|
||||
new HtmlWebpackHarddiskPlugin(),
|
||||
new CopyPlugin({
|
||||
patterns: [{
|
||||
from: join(__dirname, '../node_modules/twemoji/assets/svg'),
|
||||
to: join(output.path, 'packs/emoji'),
|
||||
}, {
|
||||
from: join(__dirname, '..', 'app', FE_INSTANCE_SOURCE_DIR),
|
||||
to: join(output.path, 'instance'),
|
||||
}, {
|
||||
from: join(__dirname, '../custom/instance'),
|
||||
to: join(output.path, 'instance'),
|
||||
noErrorOnMissing: true,
|
||||
globOptions: {
|
||||
ignore: ['**/.gitkeep'],
|
||||
},
|
||||
}],
|
||||
options: {
|
||||
concurrency: 100,
|
||||
},
|
||||
}),
|
||||
],
|
||||
|
||||
resolve: {
|
||||
extensions: settings.extensions,
|
||||
modules: [
|
||||
resolve('custom', 'modules'),
|
||||
resolve(settings.source_path),
|
||||
'node_modules',
|
||||
],
|
||||
alias: {
|
||||
'classnames': 'clsx',
|
||||
'icons': resolve('app', 'icons'),
|
||||
'custom': resolve('custom'),
|
||||
},
|
||||
fallback: {
|
||||
path: require.resolve('path-browserify'),
|
||||
util: require.resolve('util'),
|
||||
// https://github.com/facebook/react/issues/20235#issuecomment-1061708958
|
||||
'react/jsx-runtime': 'react/jsx-runtime.js',
|
||||
'react/jsx-dev-runtime': 'react/jsx-dev-runtime.js',
|
||||
},
|
||||
},
|
||||
|
||||
resolveLoader: {
|
||||
modules: ['node_modules'],
|
||||
},
|
||||
};
|
||||
|
||||
export default configuration;
|
|
@ -1,14 +0,0 @@
|
|||
// Note: You must restart bin/webpack-dev-server for changes to take effect
|
||||
console.log('Running in test mode'); // eslint-disable-line no-console
|
||||
|
||||
import { merge } from 'webpack-merge';
|
||||
|
||||
import sharedConfig from './shared';
|
||||
|
||||
import type { Configuration } from 'webpack';
|
||||
|
||||
const configuration: Configuration = {
|
||||
mode: 'development',
|
||||
};
|
||||
|
||||
export default merge<Configuration>(sharedConfig, configuration);
|
Loading…
Reference in a new issue