fix: no longer use custom element enhancement for strict csp builds, fix #707

This commit is contained in:
Justineo
2023-04-24 12:10:19 +08:00
parent b86280e1f0
commit d082883bc5
4 changed files with 1441 additions and 1354 deletions

View File

@ -28,6 +28,7 @@
"devDependencies": { "devDependencies": {
"@babel/core": "^7.18.6", "@babel/core": "^7.18.6",
"@rollup/plugin-node-resolve": "^11.2.1", "@rollup/plugin-node-resolve": "^11.2.1",
"@rollup/plugin-replace": "^5.0.2",
"@typescript-eslint/eslint-plugin": "^4.33.0", "@typescript-eslint/eslint-plugin": "^4.33.0",
"@typescript-eslint/parser": "^4.33.0", "@typescript-eslint/parser": "^4.33.0",
"@vue/cli-plugin-babel": "^5.0.7", "@vue/cli-plugin-babel": "^5.0.7",

2760
pnpm-lock.yaml generated

File diff suppressed because it is too large Load Diff

View File

@ -1,25 +1,28 @@
import typescript from "rollup-plugin-ts"; import typescript from "rollup-plugin-ts";
import { terser } from "rollup-plugin-terser"; import { terser } from "rollup-plugin-terser";
import resolve from "@rollup/plugin-node-resolve"; import resolve from "@rollup/plugin-node-resolve";
import replace from "@rollup/plugin-replace";
import styles from "rollup-plugin-styles"; import styles from "rollup-plugin-styles";
import { injectVueDemi } from "./scripts/rollup"; import { injectVueDemi } from "./scripts/rollup";
/** /**
* Convert Rollup option to a style extracted/injected version * Modifies the Rollup options for a build to support strict CSP
* @param {import('rollup').RollupOptions} option * @param {import('rollup').RollupOptions} options the original options
* @param {boolean} extract * @param {boolean} csp whether to support strict CSP
* @returns {import('rollup').RollupOptions} * @returns {import('rollup').RollupOptions} the modified options
*/ */
function handleStyle(option, extract) { function configBuild(options, csp) {
// inject styles plugin const result = { ...options };
const result = { ...option };
const { plugins, output } = result; const { plugins, output } = result;
result.plugins = (plugins || []).concat(
extract ? styles({ mode: ["extract", "style.css"] }) : styles() result.plugins = [
); ...(csp ? [replace({ __CSP__: `${csp}`, preventAssignment: true })] : []),
...plugins,
csp ? styles({ mode: ["extract", "style.css"] }) : styles()
];
// modify output file names // modify output file names
if (extract && output) { if (csp && output) {
result.output = (Array.isArray(output) ? output : [output]).map(output => { result.output = (Array.isArray(output) ? output : [output]).map(output => {
return { return {
...output, ...output,
@ -33,7 +36,7 @@ function handleStyle(option, extract) {
} }
/** @type {import('rollup').RollupOptions[]} */ /** @type {import('rollup').RollupOptions[]} */
const options = [ const builds = [
{ {
input: "src/index.ts", input: "src/index.ts",
plugins: [ plugins: [
@ -133,6 +136,6 @@ const options = [
]; ];
export default [ export default [
...options.map(option => handleStyle(option, false)), ...builds.map(options => configBuild(options, false)),
...options.map(option => handleStyle(option, true)) ...builds.map(options => configBuild(options, true))
]; ];

View File

@ -41,7 +41,8 @@ import { omitOn, unwrapInjected } from "./utils";
import { register, TAG_NAME, type EChartsElement } from "./wc"; import { register, TAG_NAME, type EChartsElement } from "./wc";
import "./style.css"; import "./style.css";
const wcRegistered = register(); const __CSP__ = false;
const wcRegistered = __CSP__ ? false : register();
if (Vue2) { if (Vue2) {
Vue2.config.ignoredElements.push(TAG_NAME); Vue2.config.ignoredElements.push(TAG_NAME);