[关闭]
@dlutwuwei 2017-06-16T05:17:41.000000Z 字数 1405 阅读 609

减肥项目前端上线文档

outsource

前端项目使用vuejs开发，所有页面都是由前端生成html交给浏览器渲染，后台只负责提供数据和引入脚本。

前端页面的改动，都需要重新打包js脚本，引入上线

脚本打包上线

  1. # cd到静态资源文件夹
  2. cd /var/www/slip/Public/
  4. # 拉取代码,需要注册gitcafe账号并加入项目组
  5. # 如果有源代码的话不需要用git clone了，跳过此步
  6. git clone https://git.coding.net/dlutwuwei/dieting.git
  8. #打开前端项目文件夹
  9. cd /var/www/slip/Public/dieting
  11. #拉取最新代码
  12. git pull origin master
  14. #安装依赖
  15. npm insall
  17. #打包脚本， 每个页面的css和js都分别打包出一个文件
  18. npm run build
  20. #将脚本移到正确的静态地址文件夹 或者 上线到cdn
  21. yes|cp cp -r dist/public/* ../render/

安装最新版node

如果服务器上没有安装node，npm，需要安装

  1. yum install -y gcc-c++ make
  2. curl -sL https://rpm.nodesource.com/setup_6.x | sudo -E bash -
  4. yum install nodejs

页面脚本引入的路径

如果项目文件路径没有任何修改，则不需要修改

在php后端的页面里，如果脚本的引用路径有变化也需要修改, 修改成当前脚本静态文件可访问的路径

  1. <html>
  2.   <head>
  3.     <meta charset="utf-8">
  4.     <title>鸣鹿健康</title>
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">
  6.     <meta content="yes" name="apple-mobile-web-app-capable">
  7.     <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
  8.     <meta content="black" name="apple-mobile-web-app-status-bar-style">
  9.   <link href="/Public/render/css/detail.css" rel="stylesheet"></head>
  10.   <body>
  11.     <div id="app" v-cloak>
  12.         <router-view></router-view>
  13.     </div>
  15.     <!-- built files will be auto injected -->
  16.   <script type="text/javascript" src="/Public/render/js/detail.js"></script></body>
  17. </html>

比如上面的css文件和js脚本路径都是在/Public/render/路径下可访问的。
如果脚本访问路径变化，或者上线到cdn上，

  1. /Public/render/js/detail.js
  2. /Public/render/css/detail.css

这个两个地址都是需要修改成正确的地址,总共有6个php后台Smarty模板都需要修改。
如果

添加新批注
在作者公开此批注前，只有你和作者可见。
回复批注