Skip to content

Commit 72fb498

Browse files
goanpecagoanpeca
committed
Move react package to use vite
1 parent 79692fc commit 72fb498

File tree

7 files changed

+316
-30
lines changed

7 files changed

+316
-30
lines changed

‎docs/src/theme/ReactLiveScope/index.tsx‎

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,7 @@ const Cell = (props: any) => {
1515
>
1616
{() => {
1717
// Keep the import via require in the BrowserOnly code block.
18-
const {
19-
Jupyter,
20-
} = require('@datalayer/jupyter-react/lib/jupyter/Jupyter');
21-
const {
22-
Cell,
23-
} = require('@datalayer/jupyter-react/lib/components/cell/Cell');
18+
const { Jupyter, Cell } = require('@datalayer/jupyter-react');
2419
return (
2520
<>
2621
<Jupyter

‎packages/docusaurus-plugin/src/theme/JupyterCell.tsx‎

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -21,14 +21,9 @@ const JupyterCell = (props: JupyterCellProps) => {
2121
>
2222
{() => {
2323
// Keep the import via require and keep it into the BrowserOnly code block..
24-
// const { JupyterReactTheme } = require('@datalayer/jupyter-react/lib/theme');
25-
// const { useJupyter } = require('@datalayer/jupyter-react/lib/jupyter/JupyterContext');
26-
const {
27-
Jupyter,
28-
} = require('@datalayer/jupyter-react/lib/jupyter/Jupyter');
29-
const {
30-
Cell,
31-
} = require('@datalayer/jupyter-react/lib/components/cell/Cell');
24+
// const { JupyterReactTheme } = require('@datalayer/jupyter-react');
25+
// const { useJupyter } = require('@datalayer/jupyter-react');
26+
const { Jupyter, Cell } = require('@datalayer/jupyter-react');
3227
const {
3328
jupyterServerUrl = 'https://oss.datalayer.run/api/jupyter-server',
3429
jupyterServerToken = '60c1661cc408f978c309d04157af55c9588ff9557c9380e4fb50785750703da6',

‎packages/docusaurus-plugin/src/theme/ReactLiveScope/index.tsx‎

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,7 @@ const Cell = (props: any) => {
1515
>
1616
{() => {
1717
// Keep the import via require in the BrowserOnly code block.
18-
const {
19-
Jupyter,
20-
} = require('@datalayer/jupyter-react/lib/jupyter/Jupyter');
21-
const {
22-
Cell,
23-
} = require('@datalayer/jupyter-react/lib/components/cell/Cell');
18+
const { Jupyter, Cell } = require('@datalayer/jupyter-react');
2419
return (
2520
<>
2621
<Jupyter

‎packages/react/index.html‎

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
<!--
2+
~ Copyright (c) 2021-2023 Datalayer, Inc.
3+
~
4+
~ MIT License
5+
-->
6+
7+
<!doctype html>
8+
<html>
9+
<head>
10+
<title>Jupyter React Example</title>
11+
<script id="datalayer-config-data" type="application/json">
12+
{
13+
"jupyterServerUrl": "https://prod1.datalayer.run/api/jupyter-server",
14+
"jupyterServerToken": "60c1661cc408f978c309d04157af55c9588ff9557c9380e4fb50785750703da6",
15+
"runUrl": "https://prod1.datalayer.run",
16+
"token": "",
17+
"cpuEnvironment": "python-cpu-env",
18+
"gpuEnvironment": "pytorch-gpu-env",
19+
"credits": 1
20+
}
21+
</script>
22+
<script id="jupyter-config-data" type="application/json">
23+
{
24+
"appName": "Jupyter React",
25+
"baseUrl": "https://oss.datalayer.run/api/jupyter-server",
26+
"wsUrl": "wss://oss.datalayer.run/api/jupyter-server",
27+
"token": "60c1661cc408f978c309d04157af55c9588ff9557c9380e4fb50785750703da6",
28+
"appUrl": "/lab",
29+
"themesUrl": "/lab/api/themes",
30+
"disableRTC": false,
31+
"terminalsAvailable": "false",
32+
"mathjaxUrl": "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js",
33+
"mathjaxConfig": "TeX-AMS_CHTML-full,Safe"
34+
}
35+
</script>
36+
<script
37+
data-jupyter-widgets-cdn="https://cdn.jsdelivr.net/npm/"
38+
data-jupyter-widgets-cdn-only="true"
39+
></script>
40+
<link
41+
rel="shortcut icon"
42+
href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAC7SURBVFiF7ZU9CgIxEIXfTHbPopfYc+pJ9AALtmJnZSOIoJWFoCTzLHazxh/Ebpt5EPIxM8XXTCKTxYyMCYwJFhOYCo4JFiMuu317PZwaqEBUIar4YMmskL73DytGjgu4gAt4PDJdzkkzMBloBhqBgcu69XW+1I+rNSQESNDuaMEhdP/Fj/7oW+ACLuACHk/3F5BAfuMLBjm8/ZnxNvNtHmY4b7Ztut0bqStoVSHfWj9Z6mr8LXABF3CBB3nvkDfEVN6PAAAAAElFTkSuQmCC"
43+
type="image/x-icon"
44+
/>
45+
<link
46+
href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css"
47+
rel="stylesheet"
48+
/>
49+
</head>
50+
51+
<body>
52+
<div id="root"></div>
53+
<script type="module">
54+
// Dynamically import the entry point based on environment variable
55+
const entryPoint = import.meta.env.VITE_ENTRY || 'notebookthemecolormode';
56+
const entryMap = {
57+
app: '/src/app/App.tsx',
58+
cell: '/src/examples/Cell.tsx',
59+
console: '/src/examples/Console.tsx',
60+
filebrowser: '/src/examples/FileBrowser.tsx',
61+
notebook: '/src/examples/Notebook.tsx',
62+
notebookthemecolormode: '/src/examples/NotebookThemeColormode.tsx',
63+
terminal: '/src/examples/Terminal.tsx',
64+
viewer: '/src/examples/Viewer.tsx',
65+
};
66+
67+
const modulePath =
68+
entryMap[entryPoint] || '/src/examples/NotebookThemeColormode.tsx';
69+
import(modulePath).then(module => {
70+
console.log(`Loaded entry: ${entryPoint} from ${modulePath}`);
71+
if (module.default) {
72+
module.default();
73+
}
74+
});
75+
</script>
76+
</body>
77+
</html>

‎packages/react/package.json‎

Lines changed: 18 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
"description": "Jupyter React - React.js components 100% compatible with Jupyter.",
55
"license": "MIT",
66
"main": "lib/index.js",
7+
"types": "lib/index.d.ts",
78
"files": [
89
"lib/**/*.{css,d.ts,eot,gif,html,jpg,js,js.map,json,png,svg,woff2,ttf}",
910
"style/**/*.{css,js,eot,gif,html,jpg,json,png,svg,woff2,ttf}",
@@ -29,18 +30,21 @@
2930
"access": "public"
3031
},
3132
"scripts": {
32-
"build": "gulp resources-to-lib && tsc && webpack",
33-
"build:lib": "tsc",
34-
"build:prod": "gulp resources-to-lib && tsc && npm run clean && npm run build:lib",
33+
"build": "gulp resources-to-lib && tsc --emitDeclarationOnly && cross-env BUILD_LIB=true vite build",
34+
"build:lib": "cross-env BUILD_LIB=true vite build",
35+
"build:types": "tsc --emitDeclarationOnly",
36+
"build:prod": "gulp resources-to-lib && tsc --emitDeclarationOnly && npm run clean && npm run build:lib",
3537
"build:tsc:watch:res": "gulp resources-to-lib-watch",
3638
"build:tsc:watch:tsc": "tsc --watch",
3739
"build:webpack": "cross-env BUILD_APP=true webpack-cli build",
40+
"build:vite": "vite build",
3841
"clean": "rimraf node_modules lib dist build tsconfig.tsbuildinfo",
3942
"clean:all": "npm run clean:lib && npm run clean:labextension && npm run clean:lintcache",
4043
"clean:labextension": "rimraf datalayer/labextension",
4144
"clean:lib": "rimraf lib tsconfig.tsbuildinfo",
4245
"clean:lintcache": "rimraf .eslintcache .stylelintcache",
43-
"dev": "run-p -c 'start:*'",
46+
"dev": "vite",
47+
"dev:webpack": "run-p -c 'start:*'",
4448
"eslint": "npm eslint:check --fix",
4549
"eslint:check": "eslint . --cache --ext .ts,.tsx",
4650
"example": "run-p -c 'start:*'",
@@ -51,10 +55,12 @@
5155
"prettier": "npm prettier:base --write --list-different",
5256
"prettier:base": "prettier \"**/*{.ts,.tsx,.js,.jsx,.css,.json,.md}\"",
5357
"prettier:check": "npm prettier:base --check",
54-
"start": "run-p -c 'start:*'",
58+
"preview": "vite preview",
59+
"start": "vite",
5560
"start:webpack": "webpack serve",
56-
"start-noconfig": "cross-env NO_CONFIG=true webpack serve",
57-
"start-local": "run-p -c 'start-local:*'",
61+
"start-noconfig": "cross-env NO_CONFIG=true vite",
62+
"start-noconfig:webpack": "cross-env NO_CONFIG=true webpack serve",
63+
"start-local": "cross-env LOCAL_JUPYTER_SERVER=true vite",
5864
"start-local:webpack": "cross-env LOCAL_JUPYTER_SERVER=true webpack serve",
5965
"start-local:jupyter-server": "cd ./../.. && npm run jupyter:server",
6066
"stylelint": "npm stylelint:check --fix",
@@ -237,7 +243,11 @@
237243
"webpack": "^5.74.0",
238244
"webpack-cli": "^5.1.4",
239245
"webpack-dev-server": "^4.9.3",
240-
"whatwg-fetch": "^3.6.2"
246+
"whatwg-fetch": "^3.6.2",
247+
"vite": "^5.4.0",
248+
"@vitejs/plugin-react": "^4.6.0",
249+
"vite-plugin-treat-umd-as-commonjs": "^0.1.4",
250+
"buffer": "^6.0.3"
241251
},
242252
"eslintIgnore": [
243253
"node_modules",

‎packages/react/tsconfig.json‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,13 @@
44
"exclude": ["node_modules", "src/example"],
55
"compilerOptions": {
66
"forceConsistentCasingInFileNames": true,
7-
"baseUrl": "/",
7+
"baseUrl": ".",
88
"rootDir": "./src",
99
"allowJs": false,
1010
"allowSyntheticDefaultImports": true,
11-
"composite": true,
11+
"composite": false,
1212
"declaration": true,
13+
"declarationMap": true,
1314
"esModuleInterop": true,
1415
"incremental": true,
1516
"jsx": "react-jsx",

0 commit comments

Comments
 (0)