@lx-frontend/theme-preview
v0.0.1
Published
A development tool to preview library theme.
Downloads
7
Maintainers
Keywords
Readme
主题库配置
安装预览工具
npm install -D theme-preview
预览工具初始化
在项目根目录下,运行以下命令:
init-preview
该步骤实现两个操作:
- 在根目录先创建了
preview.config.js
配置文件 - 创建了
preview
文件夹,以及预览主题所需的HTML模板文件
其中,第二步所创建的文件结构是可选的,开发者可按照自己的需要创建所需文件,只需要在preview.config.js
配置中修改相关路径即可。
预览文件配置
- 静态资源配置。将demo展示所需的静态资源放在
preview/static
目录下,比如,字体文件,图片等。demo示例和HTML模板中可直接通过/static/path/to/source
的方式获取资源。 - HTML模板文件
preview/index.html
。该文件用来挂载demo实例。 · 引入任意的样式文件 · 引入库文件,如vue、element-ui、cvux等 · 如有需要,使用script
标签自定义逻辑。 · 引入/static/index.css
,该文件由组件样式经编译后生成。
配置preview.config.js
根据预览文件配置,修改根目录下preview.config.js
配置文件。
启动
在package.json中配置以下命令
"script": {
"dev": "preview"
}
然后,运行npm run dev
即可启动