mtk-linkit-webui编译环境及流程

1.编译环境搭建
ubuntu12.04-32bit

1.1 下载指定版本的安装包node-v0.10.28.tar.gz
tar -xvf node-v0.10.28.tar.gz
./configure
make
sudo make install
sudo npm install npm@2.9.0 -g
注意：node跟npm官方文档指定的是v0.10.28跟2.9.0，但是实际编译过程中要求node的版本最少要大于v4.3，所以后面要将node版本替换

1.2 所需的安装包到一下网址下载即可
http://nodejs.org/dist/

2.编译源码
2.1 拷贝一份源码出来
从目录：
openwrt/build_dir/target-mipsel_24kec+dsp_uClibc-0.9.33.2
拷贝一份web源码mtk-linkit-webui-2015-07-07
到~/work/wooya_openwrt/

2.2 进入源码目录
cd mtk-linkit-webui-2015-07-07/

2.3 安装资源包
sudo npm i

2.4 替换node版本
删除旧的node
sudo rm /usr/local/bin/node
下载解压node-v4.4.5-linux-x86.tar.gz
创建软链接，创建完成后使用node -v查看是否版本是对的
sudo ln -s /home/wooya/work/wooya_openwrt/node-v4.4.5-linux-x86/bin/node /usr/local/bin/node

2.5 特别注意
2.3跟2.4的顺序一定不能颠倒，颠倒会导致一些资源包无法更新，后面编译会出错。

2.6 编译
sudo npm run watch
第一次编译会出错，如下，

提示找不到zh-cn，我们只要做如下修改就好，打开源码下app/webpack.client.config.js文件，修改
‘zh-cn’: require(‘./locale/zh-cn’),
‘zh-tw’: require(‘./locale/zh-tw’),改为
‘zh-cn’: require(‘./locale/zh-CN’),
‘zh-tw’: require(‘./locale/zh-TW’),

如果提示：webpack: Compiled with warnings.表示编译完成，按ctrl+c退出即可，如下图

3.打包源码
webpack
运行完成后可以查看app/build下面的文件是否更新了，更新了即说明打包成功。

4.替换mediatek.png图片
4.1 将要替换的图片拷贝到
~/work/wooya_openwrt/mtk-linkit-webui-2015-07-07/app/img下面替换掉老的图片

4.2 到源码目录
cd ~/work/wooya_openwrt/mtk-linkit-webui-2015-07-07/
一次执行：
sudo npm run watch
Webpack

4.3 拷贝生成文件

将图中这三个文件拷贝到

4.4 打包固件
到openwrt源码目录下：
make V=99
生成固件重新烧录后登陆界面如下，修改完成。

转载请注明出处，支持原创。