mirror of
https://github.com/strapi/strapi.git
synced 2025-09-01 21:03:02 +00:00
Add terser plugin
Signed-off-by: soupette <cyril.lpz@gmail.com>
This commit is contained in:
soupette
parent
7f8c898bf7
commit
52adb33a00
1
packages/core/helper-plugin/.gitignore
vendored
1
packages/core/helper-plugin/.gitignore
vendored
@ -11,3 +11,4 @@ yarn-error.log
|
||||
.DS_Store
|
||||
npm-debug.log
|
||||
.idea
|
||||
stats.html
|
||||
@ -3,9 +3,6 @@ import { getType, getOtherInfos } from './content-manager/utils/getAttributeInfo
|
||||
export { default as colors } from './assets/styles/colors';
|
||||
export { default as sizes } from './assets/styles/sizes';
|
||||
|
||||
// CommonPropTypes
|
||||
export { default as routerPropTypes } from './commonPropTypes/router';
|
||||
export { default as themePropTypes } from './commonPropTypes/themeShape';
|
||||
// Components
|
||||
export { default as BackHeader } from './components/BackHeader';
|
||||
export { default as BaselineAlignment } from './components/BaselineAlignment';
|
||||
@ -140,9 +137,7 @@ export { darken } from './utils/colors';
|
||||
export { default as getFileExtension } from './utils/getFileExtension';
|
||||
export { default as getFilterType } from './utils/getFilterType';
|
||||
export { default as getQueryParameters } from './utils/getQueryParameters';
|
||||
export { default as injectHooks } from './utils/injectHooks';
|
||||
export { default as validateInput } from './utils/inputsValidations';
|
||||
export { default as Manager } from './utils/Manager';
|
||||
export { default as request } from './utils/request';
|
||||
export { default as storeData } from './utils/storeData';
|
||||
export { default as templateObject } from './utils/templateObject';
|
||||
|
||||
@ -1,275 +0,0 @@
|
||||
import { findIndex, lowerCase, pullAt, range } from 'lodash';
|
||||
import { List } from 'immutable';
|
||||
|
||||
class Manager {
|
||||
constructor(state, list, keys, index, layout) {
|
||||
this.state = state;
|
||||
this.keys = keys.split('.');
|
||||
this.layout = layout;
|
||||
this.list = list;
|
||||
this.index = index;
|
||||
this.arrayOfEndLineElements = this.getLinesBound();
|
||||
this.attrToRemoveInfos = this.attrToRemoveInfos();
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieve the bootstrap col index, name and type of a field
|
||||
* @param {Number} index
|
||||
* @returns {Object}
|
||||
*/
|
||||
getAttrInfos(index) {
|
||||
const name = this.getAttrName(index);
|
||||
const appearance = this.layout.getIn([name, 'appearance']);
|
||||
const type = appearance !== '' && appearance !== undefined ? appearance : this.getType(name);
|
||||
const bootstrapCol = this.getBootStrapCol(type);
|
||||
|
||||
const infos = {
|
||||
bootstrapCol,
|
||||
index,
|
||||
name,
|
||||
type,
|
||||
};
|
||||
|
||||
return infos;
|
||||
}
|
||||
|
||||
getColsToAdd(number) {
|
||||
let ret;
|
||||
|
||||
switch (number) {
|
||||
case 12:
|
||||
ret = [];
|
||||
break;
|
||||
case 9:
|
||||
ret = ['__col-md-3__', '__col-md-6__'];
|
||||
break;
|
||||
case 8:
|
||||
ret = ['__col-md-4__', '__col-md-4__'];
|
||||
break;
|
||||
case 4:
|
||||
ret = ['__col-md-4__'];
|
||||
break;
|
||||
case 6:
|
||||
ret = ['__col-md-6__'];
|
||||
break;
|
||||
default:
|
||||
ret = ['__col-md-3__'];
|
||||
}
|
||||
|
||||
const random = Math.random()
|
||||
.toString(36)
|
||||
.substring(7);
|
||||
const random1 = Math.random()
|
||||
.toString(36)
|
||||
.substring(8);
|
||||
|
||||
return ret.map((v, i) => {
|
||||
if (i === 0) {
|
||||
return `${v}${random}`;
|
||||
}
|
||||
|
||||
return `${v}${random1}`;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieve a field default bootstrap col
|
||||
* NOTE: will change if we add the customisation of an input's width
|
||||
* @param {String} type
|
||||
* @returns {Number}
|
||||
*/
|
||||
getBootStrapCol(type) {
|
||||
switch (lowerCase(type)) {
|
||||
case 'checkbox':
|
||||
case 'boolean':
|
||||
case 'date':
|
||||
case 'biginteger':
|
||||
case 'decimal':
|
||||
case 'float':
|
||||
case 'integer':
|
||||
case 'number':
|
||||
return 4;
|
||||
case 'json':
|
||||
case 'wysiwyg':
|
||||
return 12;
|
||||
default:
|
||||
return 6;
|
||||
}
|
||||
}
|
||||
|
||||
getElementsOnALine(itemsToPull, arr = this.list) {
|
||||
const array = List.isList(arr) ? arr.toJS() : arr;
|
||||
|
||||
return pullAt(array, itemsToPull);
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieve the field to remove infos
|
||||
* @returns {Object}
|
||||
*/
|
||||
attrToRemoveInfos() {
|
||||
return this.getAttrInfos(this.index);
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* Retrieve the last element of each line of a bootstrap grid and push it into an array
|
||||
* @returns {Array}
|
||||
*/
|
||||
getLinesBound() {
|
||||
const array = [];
|
||||
let sum = 0; // sum of each element associated bootstrap col (max sum === 12)
|
||||
|
||||
this.list.forEach((item, i) => {
|
||||
let { bootstrapCol, index, name, type } = this.getAttrInfos(i);
|
||||
|
||||
if (!type && name.includes('__col')) {
|
||||
// Only for the added elements
|
||||
bootstrapCol = parseInt(name.split('__')[1].split('-')[2], 10);
|
||||
}
|
||||
|
||||
sum += bootstrapCol;
|
||||
|
||||
if (sum === 12 || bootstrapCol === 12) {
|
||||
// Push into the array the element so we know each right bound of a grid line
|
||||
const isFullSize = bootstrapCol === 12;
|
||||
array.push({ name, index, isFullSize });
|
||||
sum = 0;
|
||||
}
|
||||
|
||||
if (sum > 12) {
|
||||
// Reset the sum
|
||||
sum = 0;
|
||||
}
|
||||
|
||||
if (i < this.list.size - 1) {
|
||||
let { bootstrapCol: nextBootstrapCol, name: nextName, type: nextType } = this.getAttrInfos(
|
||||
i + 1
|
||||
);
|
||||
|
||||
if (!nextType && nextName.includes('__col')) {
|
||||
nextBootstrapCol = parseInt(nextName.split('__')[1].split('-')[2], 10);
|
||||
}
|
||||
|
||||
if (sum + nextBootstrapCol > 12) {
|
||||
const isFullSize = bootstrapCol === 12;
|
||||
array.push({ name, index, isFullSize });
|
||||
sum = 0;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return array;
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* Retrieve the field's type depending on its name
|
||||
* @param {String} itemName
|
||||
* @returns {String}
|
||||
*/
|
||||
getType(itemName) {
|
||||
return this.state.getIn([
|
||||
'modifiedSchema',
|
||||
'models',
|
||||
...this.keys,
|
||||
'availableFields',
|
||||
itemName,
|
||||
'type',
|
||||
]);
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieve a field name depending on its index
|
||||
* @param {Number} itemIndex
|
||||
* @returns {String}
|
||||
*/
|
||||
getAttrName(itemIndex) {
|
||||
return this.state.getIn(['modifiedSchema', 'models', ...this.keys, 'fields', itemIndex]);
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieve the line bootstrap col sum
|
||||
* @param {Number} leftBound
|
||||
* @param {Number} rightBound
|
||||
* @returns {Number}
|
||||
*/
|
||||
|
||||
getLineSize(elements) {
|
||||
return elements.reduce((acc, current) => {
|
||||
const appearance = this.layout.getIn([current, 'appearance']);
|
||||
const type =
|
||||
appearance !== '' && appearance !== undefined ? appearance : this.getType(current);
|
||||
const col = current.includes('__col')
|
||||
? parseInt(current.split('__')[1].split('-')[2], 10)
|
||||
: this.getBootStrapCol(type);
|
||||
|
||||
return (acc += col);
|
||||
}, 0);
|
||||
}
|
||||
|
||||
/**
|
||||
* Given an attribute index from the list retrieve the elements' bound (loeft or right)
|
||||
* @param {Bool} dir sup or min
|
||||
* @param {Number} pivot the center
|
||||
* @returns {Object} the first sup or last sup
|
||||
*/
|
||||
getBound(dir, pivot = this.index) {
|
||||
let result = {};
|
||||
let didFindResult = false;
|
||||
|
||||
this.arrayOfEndLineElements.forEach(item => {
|
||||
const rightBondCondition =
|
||||
findIndex(this.arrayOfEndLineElements, ['index', pivot]) !== -1
|
||||
? item.index < pivot
|
||||
: item.index <= pivot;
|
||||
const condition = dir === true ? item.index >= pivot && !didFindResult : rightBondCondition; // Left or right bound of an item in the bootstrap grid.
|
||||
|
||||
if (condition) {
|
||||
didFindResult = true;
|
||||
result =
|
||||
dir === true
|
||||
? item
|
||||
: {
|
||||
name: this.list.get(item.index + 1),
|
||||
index: item.index + 1,
|
||||
isFullSize: false,
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
/**
|
||||
* Make sure to complete each line with __col-md-the-missing-number to complete a line on the bootstrap grid
|
||||
* @returns {List}
|
||||
*/
|
||||
getLayout() {
|
||||
let newList = this.list;
|
||||
let sum = 0;
|
||||
|
||||
this.arrayOfEndLineElements.forEach((item, i) => {
|
||||
const firstLineItem = i === 0 ? 0 : this.arrayOfEndLineElements[i - 1].index + 1;
|
||||
const lastLineItem = item.index + 1;
|
||||
const lineRange =
|
||||
firstLineItem === lastLineItem ? [firstLineItem] : range(firstLineItem, lastLineItem);
|
||||
const lineItems = this.getElementsOnALine(lineRange);
|
||||
const lineSize = this.getLineSize(lineItems);
|
||||
|
||||
if (lineSize < 10 && i < this.arrayOfEndLineElements.length - 1) {
|
||||
const colsToAdd = this.getColsToAdd(12 - lineSize);
|
||||
newList = newList.insert(lastLineItem + sum, colsToAdd[0]);
|
||||
|
||||
if (colsToAdd.length > 1) {
|
||||
newList = newList.insert(lastLineItem + sum, colsToAdd[1]);
|
||||
}
|
||||
sum += 1;
|
||||
}
|
||||
});
|
||||
|
||||
return newList;
|
||||
}
|
||||
}
|
||||
|
||||
export default Manager;
|
||||
@ -1,100 +0,0 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import hoistNonReactStatics from 'hoist-non-react-statics';
|
||||
import invariant from 'invariant';
|
||||
|
||||
export default ({ key, pluginId }) => WrappedComponent => {
|
||||
class WithHooks extends React.Component {
|
||||
static WrappedComponent = WrappedComponent;
|
||||
|
||||
static displayName = `withHooks(${WrappedComponent.displayName ||
|
||||
WrappedComponent.name ||
|
||||
'Component'})`;
|
||||
|
||||
static contextTypes = {
|
||||
plugins: PropTypes.object,
|
||||
};
|
||||
|
||||
static propTypes = {
|
||||
global: PropTypes.object,
|
||||
};
|
||||
|
||||
static defaultProps = {
|
||||
global: {},
|
||||
};
|
||||
|
||||
state = { hooks: {}, otherComponents: [] };
|
||||
|
||||
componentDidMount() {
|
||||
this.prepareHooks();
|
||||
}
|
||||
|
||||
getHook = hookName => {
|
||||
const self = this.compo.current;
|
||||
const { hooks } = this.state;
|
||||
|
||||
if (hooks[hookName]) {
|
||||
hooks[hookName].forEach(hook => {
|
||||
hook.bind(self)();
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
setHooks = (...args) => {
|
||||
const updateState = hooks => {
|
||||
return this.setState(prevState => {
|
||||
const newHooks = Object.keys(hooks).reduce(
|
||||
(acc, current) => {
|
||||
if (acc[current]) {
|
||||
acc[current].push(hooks[current]);
|
||||
} else {
|
||||
acc[current] = [hooks[current]];
|
||||
}
|
||||
|
||||
return acc;
|
||||
},
|
||||
{ ...prevState.hooks }
|
||||
);
|
||||
|
||||
return { hooks: newHooks };
|
||||
});
|
||||
};
|
||||
// We know that we want to inject a hook into the admin
|
||||
if (args.length === 1) {
|
||||
const [hooks] = args;
|
||||
|
||||
updateState(hooks);
|
||||
}
|
||||
|
||||
const [target, hooks] = args;
|
||||
|
||||
if (target === `${pluginId}.${key}`) {
|
||||
updateState(hooks);
|
||||
}
|
||||
};
|
||||
|
||||
prepareHooks = () => {
|
||||
const plugins = this.props.global.plugins || this.context.plugins;
|
||||
|
||||
const errMsg =
|
||||
'The plugins object needs to be passed either in the context or the props to your container.\n' +
|
||||
`Please check the ${key} container in the ${pluginId} plugin\n\n`;
|
||||
|
||||
invariant(plugins, errMsg);
|
||||
|
||||
Object.keys(plugins)
|
||||
.filter(plugin => !!plugins[plugin].lifecycles)
|
||||
.forEach(plugin => plugins[plugin].lifecycles.bind(this)());
|
||||
};
|
||||
|
||||
compo = React.createRef();
|
||||
|
||||
render() {
|
||||
const props = { ...this.props, ...this.state, getHook: this.getHook };
|
||||
|
||||
return <WrappedComponent ref={this.compo} {...props} />;
|
||||
}
|
||||
}
|
||||
|
||||
return hoistNonReactStatics(WithHooks, WrappedComponent);
|
||||
};
|
||||
@ -31,6 +31,11 @@
|
||||
"watch": "rollup -c -w",
|
||||
"test": "echo \"no tests yet\""
|
||||
},
|
||||
"peerDependencies": {
|
||||
"immer": "^8.0.1",
|
||||
"qs": "6.10.1",
|
||||
"react-select": "^4.0.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.14.0",
|
||||
"@babel/plugin-proposal-class-properties": "7.13.0",
|
||||
@ -48,7 +53,8 @@
|
||||
"rollup": "2.46.0",
|
||||
"rollup-plugin-node-polyfills": "0.2.1",
|
||||
"rollup-plugin-peer-deps-external": "2.2.4",
|
||||
"rollup-plugin-postcss": "4.0.0"
|
||||
"rollup-plugin-postcss": "4.0.0",
|
||||
"rollup-plugin-terser": "7.0.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"@buffetjs/core": "3.3.5",
|
||||
|
||||
@ -6,6 +6,7 @@ import commonjs from '@rollup/plugin-commonjs';
|
||||
import replace from '@rollup/plugin-replace';
|
||||
import image from '@rollup/plugin-image';
|
||||
import postcss from 'rollup-plugin-postcss';
|
||||
import { terser } from 'rollup-plugin-terser';
|
||||
import packageJson from './package.json';
|
||||
|
||||
export default {
|
||||
@ -63,6 +64,7 @@ export default {
|
||||
commonjs(),
|
||||
image(),
|
||||
nodePolyfills(),
|
||||
terser(),
|
||||
],
|
||||
external: [
|
||||
...Object.keys(packageJson.dependencies || {}),
|
||||
|
||||
21
yarn.lock
21
yarn.lock
@ -11846,7 +11846,7 @@ jest-watcher@^26.6.2:
|
||||
jest-util "^26.6.2"
|
||||
string-length "^4.0.1"
|
||||
|
||||
jest-worker@^26.5.0, jest-worker@^26.6.2:
|
||||
jest-worker@^26.2.1, jest-worker@^26.5.0, jest-worker@^26.6.2:
|
||||
version "26.6.2"
|
||||
resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-26.6.2.tgz#7f72cbc4d643c365e27b9fd775f9d0eaa9c7a8ed"
|
||||
integrity sha512-KWYVV1c4i+jbMpaBC+U++4Va0cp8OisU185o73T1vo99hqi7w8tSJfUXYswwqqrjzwxa6KpRK54WhPvwf5w6PQ==
|
||||
@ -17580,6 +17580,16 @@ rollup-plugin-postcss@4.0.0:
|
||||
safe-identifier "^0.4.2"
|
||||
style-inject "^0.3.0"
|
||||
|
||||
rollup-plugin-terser@7.0.2:
|
||||
version "7.0.2"
|
||||
resolved "https://registry.yarnpkg.com/rollup-plugin-terser/-/rollup-plugin-terser-7.0.2.tgz#e8fbba4869981b2dc35ae7e8a502d5c6c04d324d"
|
||||
integrity sha512-w3iIaU4OxcF52UUXiZNsNeuXIMDvFrr+ZXK6bFZ0Q60qyVfq4uLptoS4bbq3paG3x216eQllFZX7zt6TIImguQ==
|
||||
dependencies:
|
||||
"@babel/code-frame" "^7.10.4"
|
||||
jest-worker "^26.2.1"
|
||||
serialize-javascript "^4.0.0"
|
||||
terser "^5.0.0"
|
||||
|
||||
rollup-pluginutils@^2.8.1, rollup-pluginutils@^2.8.2:
|
||||
version "2.8.2"
|
||||
resolved "https://registry.yarnpkg.com/rollup-pluginutils/-/rollup-pluginutils-2.8.2.tgz#72f2af0748b592364dbd3389e600e5a9444a351e"
|
||||
@ -17886,6 +17896,13 @@ serialize-error@^7.0.1:
|
||||
dependencies:
|
||||
type-fest "^0.13.1"
|
||||
|
||||
serialize-javascript@^4.0.0:
|
||||
version "4.0.0"
|
||||
resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-4.0.0.tgz#b525e1238489a5ecfc42afacc3fe99e666f4b1aa"
|
||||
integrity sha512-GaNA54380uFefWghODBWEGisLZFj00nS5ACs6yHa9nLqlLpVLO8ChDGeKRjZnV4Nh4n0Qi7nhYZD/9fCPzEqkw==
|
||||
dependencies:
|
||||
randombytes "^2.1.0"
|
||||
|
||||
serialize-javascript@^5.0.1:
|
||||
version "5.0.1"
|
||||
resolved "https://registry.yarnpkg.com/serialize-javascript/-/serialize-javascript-5.0.1.tgz#7886ec848049a462467a97d3d918ebb2aaf934f4"
|
||||
@ -19610,7 +19627,7 @@ terser@^4.6.3:
|
||||
source-map "~0.6.1"
|
||||
source-map-support "~0.5.12"
|
||||
|
||||
terser@^5.3.4, terser@^5.5.1:
|
||||
terser@^5.0.0, terser@^5.3.4, terser@^5.5.1:
|
||||
version "5.7.0"
|
||||
resolved "https://registry.yarnpkg.com/terser/-/terser-5.7.0.tgz#a761eeec206bc87b605ab13029876ead938ae693"
|
||||
integrity sha512-HP5/9hp2UaZt5fYkuhNBR8YyRcT8juw8+uFbAme53iN9hblvKnLUTKkmwJG6ocWpIKf8UK4DoeWG4ty0J6S6/g==
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user