tabshift/payloadcms
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

Merge pull request #5286 from payloadcms/feat/pre-compile-css

Browse Source 
Feat/pre compile css
This commit is contained in:
James Mikrut
2024-03-10 14:06:10 -04:00
committed by GitHub
parent 0a4cbe1a08 5e1e158414
commit 03756c4210
31 changed files with 2038 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@@ -288,3 +288,4 @@ $RECYCLE.BIN/
# End of https://www.toptal.com/developers/gitignore/api/node,macos,windows,webstorm,sublimetext,visualstudiocode
/build
.swc

15
.swcrc Normal file
View File

@@ -0,0 +1,15 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"jsc": {
"target": "esnext",
"parser": {
"syntax": "typescript",
"tsx": true,
"dts": true
}
},
"module": {
"type": "es6"
}
}

1
emptyModule.js Normal file
View File

@@ -0,0 +1 @@
export default {}

2
packages/create-payload-app/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/db-mongodb/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/db-postgres/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/graphql/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/live-preview-react/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/live-preview/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

12
packages/next/.swcrc
View File

@@ -1,12 +1,22 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {
"syntax": "typescript",
"tsx": true,
"dts": true
},
"experimental": {
"plugins": [
[
"swc-plugin-transform-remove-imports",
{
"test": "\\.(scss|css)$"
}
]
]
}
},
"module": {

21
packages/next/package.json
View File

@@ -8,9 +8,10 @@
"@payloadcms/next": "./dist/bin/index.js"
},
"scripts": {
"build": "pnpm copyfiles && pnpm build:swc && pnpm build:types",
"build": "pnpm copyfiles && pnpm build:swc && pnpm build:types && pnpm build:webpack && rm dist/prod/index.js",
"build:swc": "swc ./src -d ./dist --config-file .swcrc",
"build:types": "tsc --emitDeclarationOnly --outDir dist",
"build:webpack": "webpack --config webpack.config.js",
"clean": "rimraf {dist,*.tsbuildinfo}",
"copyfiles": "copyfiles -u 1 \"src/**/*.{html,css,scss,ttf,woff,woff2,eot,svg,jpg,png,json}\" \"src/app/api/**\" dist/ && pnpm copyfiles:api",
"copyfiles:api": "copyfiles -u 1 \"src/app/(payload)/**\" dist/template",
@@ -50,7 +51,18 @@
"@types/react": "18.2.15",
"@types/react-dom": "18.2.7",
"@types/ws": "^8.5.10",
"payload": "workspace:*"
"css-loader": "^6.10.0",
"css-minimizer-webpack-plugin": "^6.0.0",
"mini-css-extract-plugin": "1.6.2",
"payload": "workspace:*",
"postcss-loader": "^8.1.1",
"postcss-preset-env": "^9.5.0",
"sass-loader": "^14.1.1",
"swc-loader": "^0.2.6",
"swc-plugin-transform-remove-imports": "^1.12.1",
"terser-webpack-plugin": "^5.3.10",
"webpack": "^5.78.0",
"webpack-cli": "^5.1.4"
},
"dependencies": {
"@dnd-kit/core": "6.0.8",
@@ -79,6 +91,11 @@
"main": "./dist/exports/index.js",
"types": "./dist/exports/index.d.ts",
"exports": {
"./css": {
"import": "./dist/prod/styles.css",
"require": "./dist/prod/styles.css",
"default": "./dist/prod/styles.css"
},
"./withPayload": {
"import": "./dist/withPayload.js",
"require": "./dist/withPayload.js",

2
packages/next/src/layouts/Root/index.tsx
View File

@@ -1,6 +1,5 @@
import type { SanitizedConfig } from 'payload/types'
import { auth } from '@payloadcms/next/utilities/auth'
import { translations } from '@payloadcms/translations/client'
import { RootProvider, buildComponentMap } from '@payloadcms/ui'
import '@payloadcms/ui/scss/app.scss'
@@ -11,6 +10,7 @@ import React from 'react'
import 'react-toastify/dist/ReactToastify.css'
import { ClearRouteCache } from '../../elements/ClearRouteCache/index.js'
import { auth } from '../../utilities/auth.js'
import { getPayload } from '../../utilities/getPayload.js'
import { getRequestLanguage } from '../../utilities/getRequestLanguage.js'
import { DefaultEditView } from '../../views/Edit/Default/index.js'

4
packages/next/src/scss/app.scss
View File

@@ -1,5 +1,5 @@
@import 'fonts';
@import 'styles';
@import './fonts.scss';
@import './styles.scss';
@import './toastify.scss';
@import './colors.scss';

107
packages/next/webpack.config.js Normal file
View File

@@ -0,0 +1,107 @@
import OptimizeCSSAssetsPlugin from 'css-minimizer-webpack-plugin'
import MiniCSSExtractPlugin from 'mini-css-extract-plugin'
import path from 'path'
import TerserJSPlugin from 'terser-webpack-plugin'
import { fileURLToPath } from 'url'
import webpack from 'webpack'
const filename = fileURLToPath(import.meta.url)
const dirname = path.dirname(filename)
const componentWebpackConfig = {
entry: path.resolve(dirname, './src/index.ts'),
externals: ['react', 'react-dom', 'payload', 'payload/config', 'react-image-crop'],
mode: 'production',
module: {
rules: [
{
oneOf: [
{
// exclude: /node_modules/,
test: /\.(t|j)sx?$/,
use: [
{
loader: 'swc-loader',
options: {
jsc: {
experimental: {
plugins: [
// clear the plugins used in .swcrc
],
},
parser: {
syntax: 'typescript',
tsx: true,
},
},
},
},
],
},
{
sideEffects: true,
test: /\.(scss|css)$/,
use: [
MiniCSSExtractPlugin.loader,
'css-loader',
{
loader: 'postcss-loader',
options: {
postcssOptions: {
plugins: ['postcss-preset-env'],
},
},
},
'sass-loader',
],
},
{
type: 'asset/resource',
generator: {
filename: 'payload/[name][ext]',
},
test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/, /\.svg$/, /\.woff$/, /\.woff2$/],
},
],
},
],
},
optimization: {
minimizer: [
new TerserJSPlugin({
extractComments: false,
}),
new OptimizeCSSAssetsPlugin({}),
],
},
output: {
filename: 'index.js',
libraryTarget: 'commonjs2',
path: path.resolve(dirname, './dist/prod'),
publicPath: '/',
},
plugins: [
new MiniCSSExtractPlugin({
filename: 'styles.css',
ignoreOrder: true,
}),
new webpack.optimize.LimitChunkCountPlugin({
maxChunks: 1,
}),
],
resolve: {
extensionAlias: {
'.js': ['.ts', '.tsx', '.js', '.scss', '.css'],
'.mjs': ['.mts', '.mjs'],
},
extensions: ['.js', '.ts', '.tsx', '.scss', '.css'],
modules: [
'node_modules',
path.resolve(dirname, '../../node_modules'),
path.resolve(dirname, './node_modules'),
],
},
stats: 'errors-only',
}
export default componentWebpackConfig

2
packages/payload/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/plugin-cloud-storage/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/plugin-cloud/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"exclude": ["/**/*.spec.ts", "/**/mocks"],
"jsc": {
"target": "esnext",

2
packages/plugin-form-builder/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"exclude": ["/**/mocks"],
"jsc": {
"target": "esnext",

2
packages/plugin-nested-docs/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/plugin-redirects/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/plugin-search/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/plugin-sentry/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"exclude": ["/**/*.spec.ts"],
"jsc": {
"target": "esnext",

2
packages/plugin-seo/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/plugin-stripe/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/richtext-lexical/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/richtext-slate/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

2
packages/translations/.swcrc
View File

@@ -1,6 +1,6 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {

12
packages/ui/.swcrc
View File

@@ -1,12 +1,22 @@
{
"$schema": "https://json.schemastore.org/swcrc",
"sourceMaps": "inline",
"sourceMaps": true,
"jsc": {
"target": "esnext",
"parser": {
"syntax": "typescript",
"tsx": true,
"dts": true
},
"experimental": {
"plugins": [
[
"swc-plugin-transform-remove-imports",
{
"test": "\\.(scss|css)$"
}
]
]
}
},
"module": {

21
packages/ui/package.json
View File

@@ -5,9 +5,10 @@
"types": "./dist/index.d.ts",
"type": "module",
"scripts": {
"build": "pnpm copyfiles && pnpm build:swc && pnpm build:types",
"build": "pnpm copyfiles && pnpm build:swc && pnpm build:types && pnpm build:webpack && rm dist/prod/index.js",
"build:swc": "swc ./src -d ./dist --config-file .swcrc",
"build:types": "tsc --emitDeclarationOnly --outDir dist",
"build:webpack": "webpack --config webpack.config.js",
"clean": "rimraf {dist,*.tsbuildinfo}",
"copyfiles": "copyfiles -u 1 \"src/**/*.{html,css,scss,ttf,woff,woff2,eot,svg,jpg,png,json}\" dist/",
"fix": "eslint \"src/**/*.{ts,tsx}\" --fix",
@@ -37,6 +38,11 @@
"require": "./dist/exports/*.js",
"types": "./dist/exports/*.d.ts"
},
"./css": {
"import": "./dist/prod/styles.css",
"require": "./dist/prod/styles.css",
"default": "./dist/prod/styles.css"
},
"./scss": {
"import": "./dist/scss.scss",
"require": "./dist/scss.scss",
@@ -54,7 +60,18 @@
"@types/react-datepicker": "4.11.2",
"@types/react-dom": "18.2.7",
"@types/uuid": "8.3.4",
"payload": "workspace:*"
"postcss-loader": "^8.1.1",
"postcss-preset-env": "^9.5.0",
"sass-loader": "^14.1.1",
"swc-loader": "^0.2.6",
"swc-plugin-transform-remove-imports": "^1.12.1",
"css-loader": "^6.10.0",
"css-minimizer-webpack-plugin": "^6.0.0",
"mini-css-extract-plugin": "1.6.2",
"payload": "workspace:*",
"terser-webpack-plugin": "^5.3.10",
"webpack": "^5.78.0",
"webpack-cli": "^5.1.4"
},
"dependencies": {
"@dnd-kit/core": "6.0.8",

107
packages/ui/webpack.config.js Normal file
View File

@@ -0,0 +1,107 @@
import OptimizeCSSAssetsPlugin from 'css-minimizer-webpack-plugin'
import MiniCSSExtractPlugin from 'mini-css-extract-plugin'
import path from 'path'
import TerserJSPlugin from 'terser-webpack-plugin'
import { fileURLToPath } from 'url'
import webpack from 'webpack'
const filename = fileURLToPath(import.meta.url)
const dirname = path.dirname(filename)
const componentWebpackConfig = {
entry: path.resolve(dirname, './src/index.ts'),
externals: ['react', 'react-dom', 'payload', 'payload/config', 'react-image-crop'],
mode: 'production',
module: {
rules: [
{
oneOf: [
{
// exclude: /node_modules/,
test: /\.(t|j)sx?$/,
use: [
{
loader: 'swc-loader',
options: {
jsc: {
experimental: {
plugins: [
// clear the plugins used in .swcrc
],
},
parser: {
syntax: 'typescript',
tsx: true,
},
},
},
},
],
},
{
sideEffects: true,
test: /\.(scss|css)$/,
use: [
MiniCSSExtractPlugin.loader,
'css-loader',
{
loader: 'postcss-loader',
options: {
postcssOptions: {
plugins: ['postcss-preset-env'],
},
},
},
'sass-loader',
],
},
{
type: 'asset/resource',
generator: {
filename: 'payload/[name][ext]',
},
test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/, /\.svg$/, /\.woff$/, /\.woff2$/],
},
],
},
],
},
optimization: {
minimizer: [
new TerserJSPlugin({
extractComments: false,
}),
new OptimizeCSSAssetsPlugin({}),
],
},
output: {
filename: 'index.js',
libraryTarget: 'commonjs2',
path: path.resolve(dirname, './dist/prod'),
publicPath: '/',
},
plugins: [
new MiniCSSExtractPlugin({
filename: 'styles.css',
ignoreOrder: true,
}),
new webpack.optimize.LimitChunkCountPlugin({
maxChunks: 1,
}),
],
resolve: {
extensionAlias: {
'.js': ['.ts', '.tsx', '.js', '.scss', '.css'],
'.mjs': ['.mts', '.mjs'],
},
extensions: ['.js', '.ts', '.tsx', '.scss', '.css'],
modules: [
'node_modules',
path.resolve(dirname, '../../node_modules'),
path.resolve(dirname, './node_modules'),
],
},
stats: 'errors-only',
}
export default componentWebpackConfig

1743
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff