另外elementUI的官网好像中毒了一样,vue版本的文档完全被广告遮挡了,这是官网要和代码一起停止维护的节奏吗?(有些可惜了,傻鱼使用elementUI的体验还是很不错的。>_<)
由于傻鱼工作中使用的UI库主要是element,看不了官方文档真心不方便,于是打算把官网部署到本地环境。
过程很简单
首先下载一份源码:官方仓库(https://github.com/ElemeFE/element),elementui的源码中包含了elementui官方文档的源码
本地安装运行(npm install....)
然后分析package.json中的指令。。。里面的指令很多,我们以后逐个分析。
找到dev指令,看到执行内容为:
"dev": "npm run bootstrap && npm run build:file && cross-env NODE_ENV=development webpack-dev-server --config build/webpack.demo.js & node build/bin/template.js",
dev干了很多事,我们先只看 webpack-dev-server启动的哪个配置文件,webpack.demo.js,看一下这个配置文件内容
本地运行的入口文件是 examples/entry.js ,事实上这个文件正式文档部分源码的入口文件(example目录下是官方文档源码)
启动端口8085
本地启动结果如下图
现在问题来了
我们可以本地启动官方文档,那怎样把官方文档打包,部署到我们的本地的Nginx上呢?
package.json里当然已经有这条指令了
"deploy:build": "npm run build:file && cross-env NODE_ENV=production webpack --config build/webpack.demo.js && echo element.eleme.io>>examples/element-ui/CNAME",
配置文件还是webpack.demo.js,看看它将我们的官网打包到哪里了
在examples文件夹下会生产一个element-ui文件夹。。。
看来这就是我们的官网了,将这个文件夹放到Nginx上试一下。
结果如下:
到此,我们已经把elementui的官方文档部署到了我们本地。