-
-
Notifications
You must be signed in to change notification settings - Fork 734
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Sheets not rendering #4655
Labels
documentation
Improvements or additions to documentation
question
Further information is requested
scope:umd
Comments
The document needs to be updated @hexf00 |
Ok thanks.
But why the previous versions doesn't work?
…On Sun, 16 Feb 2025, 9:26 am 白熱, ***@***.***> wrote:
The document needs to be updated @hexf00 <https://github.com/hexf00>
—
Reply to this email directly, view it on GitHub
<#4655 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/ASZUMUWL3WQAEGXSINFK2ND2QAHOTAVCNFSM6AAAAABXG2ZSFWVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDMNRRGIZTQNBTGQ>
.
You are receiving this because you authored the thread.Message ID:
***@***.***>
[image: jikkai]*jikkai* left a comment (dream-num/univer#4655)
<#4655 (comment)>
The document needs to be updated @hexf00 <https://github.com/hexf00>
—
Reply to this email directly, view it on GitHub
<#4655 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/ASZUMUWL3WQAEGXSINFK2ND2QAHOTAVCNFSM6AAAAABXG2ZSFWVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDMNRRGIZTQNBTGQ>
.
You are receiving this because you authored the thread.Message ID:
***@***.***>
|
@jawadk116 Due to its complexity, the combined usage method in UMD is no longer our recommended approach. We suggest using the presets method in UMD, which hides some of the complexity. The following code will work in version 0.6.0: <head>
<script src="https://unpkg.com/[email protected]/umd/react.production.min.js"></script>
<script src="https://unpkg.com/[email protected]/umd/react-dom.production.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/bundles/rxjs.umd.min.js"></script>
<script src="https://unpkg.com/@wendellhu/[email protected]/dist/redi.js"></script>
<script src="https://unpkg.com/@wendellhu/[email protected]/dist/react-bindings.js"></script>
<script>
/**
* Starting from Univer 0.6.0, with the support for React 19[^1], UMD users may need additional adaptation.
*
* [^1]: [support for React 19] https://github.com/dream-num/univer/pull/4247
*/
/**
* Fix `Uncaught TypeError: client.createRoot is not a function`
* If using UMD React < 18, you might need the following code.
*/
(function (global) {
'use strict';
if (!global.ReactDOM) {
throw new Error('ReactDOM must be loaded before ReactCreateRoot.');
}
const ReactDOM = global.ReactDOM;
if (!ReactDOM.createRoot) {
ReactDOM.createRoot = function (container) {
return {
render: (element) => {
ReactDOM.render(element, container);
},
};
};
}
})(this);
/**
* Fix `Uncaught TypeError: jsxRuntime.jsx is not a function`
* If using UMD React, you might need the following code.
* Reference: https://unpkg.com/[email protected]/cjs/react-jsx-runtime.production.min.js
*/
(function (global) {
'use strict';
if (!global.React) {
throw new Error('React must be loaded before ReactJSXRuntime.');
}
const React = global.React;
if (!React.jsx || !React.jsxs) {
const REACT_ELEMENT_TYPE = Symbol.for('react.element');
const hasOwnProperty = Object.prototype.hasOwnProperty;
const RESERVED_PROPS = {
key: true,
ref: true,
__self: true,
__source: true,
};
const ReactCurrentOwner = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner;
function createReactElement(type, config, maybeKey) {
const props = {};
let key = null;
let ref = null;
if (maybeKey !== undefined) {
key = `${maybeKey}`;
}
if (config.key !== undefined) {
key = `${config.key}`;
}
if (config.ref !== undefined) {
ref = config.ref;
}
for (var propName in config) {
if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
props[propName] = config[propName];
}
}
if (type && type.defaultProps) {
const defaultProps = type.defaultProps;
for (var propName in defaultProps) {
if (props[propName] === undefined) {
props[propName] = defaultProps[propName];
}
}
}
return {
$$typeof: REACT_ELEMENT_TYPE,
type,
key,
ref,
props,
_owner: ReactCurrentOwner.current,
};
}
React.jsx = createReactElement;
React.jsxs = createReactElement;
}
})(this);
</script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/index.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/facade.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/facade.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/facade.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/facade.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/facade.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/facade.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/facade.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/facade.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/locale/en-US.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/locale/en-US.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/locale/en-US.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/locale/en-US.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/locale/en-US.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/locale/en-US.js"></script>
<script src="https://unpkg.com/@univerjs/[email protected]/lib/umd/locale/en-US.js"></script>
<link rel="stylesheet" href="https://unpkg.com/@univerjs/[email protected]/lib/index.css" />
<link rel="stylesheet" href="https://unpkg.com/@univerjs/[email protected]/lib/index.css" />
<link rel="stylesheet" href="https://unpkg.com/@univerjs/[email protected]/lib/index.css" />
<link rel="stylesheet" href="https://unpkg.com/@univerjs/[email protected]/lib/index.css" />
<link rel="stylesheet" href="https://unpkg.com/@univerjs/[email protected]/lib/index.css" />
<link rel="stylesheet" href="https://unpkg.com/@univerjs/[email protected]/lib/index.css" />
<style>
html,
body,
#root,
#app {
padding: 0;
margin: 0;
height: 100%;
}
</style>
</head>
<body>
<div id="app"></div>
<script>
const { Univer, LocaleType, merge, UniverInstanceType } = UniverCore
const { FUniver } = UniverCoreFacade
const { defaultTheme } = UniverDesign
const { UniverRenderEnginePlugin } = UniverEngineRender
const { UniverFormulaEnginePlugin } = UniverEngineFormula
const { UniverUIPlugin } = UniverUi
const { UniverSheetsPlugin } = UniverSheets
const { UniverSheetsUIPlugin } = UniverSheetsUi
const { UniverDocsPlugin } = UniverDocs
const { UniverDocsUIPlugin } = UniverDocsUi
const { UniverSheetsFormulaPlugin } = UniverSheetsFormula
const { UniverSheetsFormulaUIPlugin } = UniverSheetsFormulaUi
const { UniverSheetsNumfmtPlugin } = UniverSheetsNumfmt
const { UniverSheetsNumfmtUIPlugin } = UniverSheetsNumfmtUi
const univer = new Univer({
theme: defaultTheme,
locale: LocaleType.EN_US,
locales: {
[LocaleType.EN_US]: merge(
{},
UniverDesignEnUS,
UniverUiEnUS,
UniverSheetsEnUS,
UniverSheetsUiEnUS,
UniverDocsUiEnUS,
UniverSheetsFormulaUiEnUS,
UniverSheetsNumfmtUiEnUS
),
},
});
univer.registerPlugin(UniverRenderEnginePlugin);
univer.registerPlugin(UniverFormulaEnginePlugin);
univer.registerPlugin(UniverUIPlugin, {
container: 'app',
});
univer.registerPlugin(UniverSheetsPlugin);
univer.registerPlugin(UniverSheetsUIPlugin);
univer.registerPlugin(UniverDocsPlugin);
univer.registerPlugin(UniverDocsUIPlugin);
univer.registerPlugin(UniverSheetsFormulaPlugin);
univer.registerPlugin(UniverSheetsFormulaUIPlugin);
univer.registerPlugin(UniverSheetsNumfmtPlugin);
univer.registerPlugin(UniverSheetsNumfmtUIPlugin);
univer.createUnit(UniverInstanceType.UNIVER_SHEET, {});
const univerAPI = FUniver.newAPI(univer);
</script>
</body> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Labels
documentation
Improvements or additions to documentation
question
Further information is requested
scope:umd
Hi,
I have integrated UniverJS Sheets into my Laravel application using the UNPKG CDN. It was functioning correctly until two days ago when it suddenly stopped working.
Upon inspecting the browser console, I encountered 27 errors related to the core library and other dependencies. I attempted to explicitly specify different versions in the CDN links (0.5.0, 0.5.1, 0.5.2, 0.5.3, 0.5.4, 0.5.5, and 0.6.0), but none resolved the issue.
To further investigate, I visited the official UniverJS documentation and copied the Example 1 code. I created a new HTML file on my local machine, pasted the code, and ran it in Google Chrome. However, the sheet failed to render, and the browser console displayed the same 27 errors.
Could you please assist me in resolving this issue?
Here is the link to Example 1: UniverJS Example 1
Below is the code I copied:
Looking forward to your support.
Best regards,
Jawad Khan
The text was updated successfully, but these errors were encountered: