themes - 如何创建自定义 JupyterLab css 主题扩展?
问题描述
我正在寻找一种将自定义 CSS 应用于 Jupyter Lab 笔记本的直接方法。我已尝试遵循文档并收到以下错误:
Missing extension module "lib/index.js"
跑完之后jupyter labextension install .
Jupyter Lab 依靠主题来调整笔记本格式。这似乎是一种使自定义主题可重用的合理方法,但我花了很长时间弄清楚如何进行和应用我想做的一组更改。
按照上面链接的主题文档:
要基于 JupyterLab Light Theme 快速创建主题,请按照贡献指南中的说明进行操作,然后从存储库根目录运行 jlpm run create:theme。选择名称、标题和描述后,将在当前目录中创建一个新的主题文件夹。您可以将该新文件夹移动到您选择的位置,然后开始进行所需的更改。
贡献指南中的步骤引导我执行以下操作:
- 使用Fork从 GitHub 克隆 JupyterLab 存储库。
pip install -e .
jlpm install
jlpm run build
jlpm run build:core
jupyter lab build
全部来自我克隆存储库的本地目录。这有安装 JupyterLab 的最新 alpha 版本的副作用,这不是我想要的。我需要使用稳定版本,所以我通过 conda 卸载了 jupyterlab,然后重新安装了它。
然后我使用 JupyterLab 的 0.35.4 标签重复了上述操作。我只在不太可能的情况下提到这一点,即双重安装在某个地方搞砸了。
然后,查看主题创作文档,我首先:
npm install
, 运行无事故npm run build
,抱怨../application/tsconfig.json
没有找到我认为可以的,因为我认为我没有使用任何 TypeScript (??)jupyter labextension install .
失败是因为lib/index.js
没有找到。
我想这是因为lib/index.js
列在"main"
.
如果我的唯一目标是更改目录中的 .css 文件,我不确定要更改此配置的哪些部分以及要保留哪些部分style
。
这是我的完整package.json
文件:
{
"name": "FirstTheme",
"version": "0.19.1",
"description": "My first Theme",
"homepage": "https://github.com/jupyterlab/jupyterlab",
"bugs": {
"url": "https://github.com/jupyterlab/jupyterlab/issues"
},
"license": "BSD-3-Clause",
"author": "Project Jupyter",
"files": [
"lib/*.d.ts",
"lib/*.js.map",
"lib/*.js",
"static/*.css",
"static/*.ttf",
"static/*.eot",
"static/*.woff",
"static/*.woff2"
],
"main": "lib/index.js",
"types": "lib/index.d.ts",
"directories": {
"lib": "lib/"
},
"repository": {
"type": "git",
"url": "https://github.com/jupyterlab/jupyterlab.git"
},
"scripts": {
"build": "tsc -b",
"build:src": "tsc -b src",
"build:webpack": "webpack",
"clean": "rimraf lib && rimraf static",
"prepublishOnly": "npm run build",
"watch": "tsc -b --watch",
"watch:src": "tsc -b src --watch",
"watch:webpack": "webpack --watch"
},
"dependencies": {
"@jupyterlab/application": "^0.19.1",
"@jupyterlab/apputils": "^0.19.1",
"ajv": "^6.7.0",
"font-awesome": "~4.7.0"
},
"devDependencies": {
"css-loader": "~0.28.7",
"mini-css-extract-plugin": "^0.4.0",
"npm-run-all": "~4.1.1",
"rimraf": "~2.6.2",
"svg-url-loader": "~2.3.1",
"svgo": "~1.0.4",
"svgo-loader": "~2.1.0",
"typedoc": "~0.12.0",
"typescript": "~3.1.1",
"url-loader": "~1.0.1",
"webpack": "~4.12.0",
"webpack-cli": "^3.0.3"
},
"publishConfig": {
"access": "public"
},
"jupyterlab": {
"extension": true,
"themeDir": "static"
}
}
解决方案
推荐阅读
- xslt - tibco bw 6.4 XSLT 与架构组件属性不同步
- python-2.7 - neovim:没有名为 __future__ 的模块
- angular - 角灯箱:无法绑定到“数据灯箱”,因为它不是“a”的已知属性
- java - Spring Data REST - collectionResourceRel 与路径
- javascript - 范围输入偏移量计算不匹配
- powerbi - Power BI“应用查询更改”运行时间不可行
- visual-studio - T4 迭代解决方案文件夹中的项目
- python - 如何创建非阻塞线程?
- visual-studio-code - 集成终端中缺少 nvm、节点等路径
- php - 使用 Facebook 登录时从 chrome 扩展程序访问网站