• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

Discuz-Q-Web: Discuz! Q2.0 pc端不再维护,推荐使用Discuz! Q-Fe

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称:

Discuz-Q-Web

开源软件地址:

https://gitee.com/Discuz/Discuz-Q-Web

开源软件介绍:

Discuz-Q-Web

Build Setup

# install dependencies$ yarn install# serve with hot reload at localhost:3000$ yarn dev# build for production and launch server$ yarn build$ yarn start# generate static project$ yarn generate

For detailed explanation on how things work, check out Nuxt.js docs.

部署流程

打包前配置

修改根目录下面的config.js配置文件,其中DEV_API_URL是本地二次开发的时候需要配置的api请求域名,SSR_API_URL是在生产环境开启ssr模式的时候需要配置的api请求域名

只有生产环境使用了ssr,才需要配置SSR_API_URL,静态化部署可以忽略

安装依赖

npm install

包含ssr的部署

运行打包命令

npm run build

开启服务

pm2之类的进程管理工具开启一个node服务

 pm2 start npm --name "DiscuzQ" -- run start

不包含ssr的spa模式部署

npm run build:spa

生成dist目录,访问index.html即可

多场景开发规范

  1. 开发规范

项目版本管理

  1. Git 分支开发工作流

项目目录结构说明

|-- api                       api 存放目录以及对于请求数据的处理存放目录| |-- request.js              api: 请求之前或者之后处理函数|-- assets                    资源存放目录| |-- css                     公共样式存放目录| | |-- variable              公共样式变量目录| | | |-- color.scss          styles: 颜色| | | |-- mixin.scss          styles: mixin函数| | |-- reset.scss            styles: 重置页面样式| |-- svg-icons               svg存放目录|-- components                页面公用的组件存放的目录|-- directive                 指令存放的目录| |-- permission.js           按钮鉴权指令|-- dist                      构建之后生成的目录|-- layouts                   网站布局文件存放目录| |-- center_layout.vue       个人中心布局文件| |-- custom_layout.vue       首页等双列布局文件| |-- default.vue             默认布局文件| |-- error_layout.vue        错误页等没有头部底部布局文件|-- library                   存放一些第三方依赖库等|-- middleware                存放应用的中间件|-- mixin                     存放mixin文件|-- pages                   | |-- pages                   项目的开发目录| |-- _.vue                   404页面| |--index.vue                首页|-- plugins                   插件存放目录| |-- lang                    国际化设置目录(语言设置)|-- static                    用于存放应用的静态文件,此类文件不会被 Nuxt.js 调用 Webpack 进行构建编译处理。服务器启动的时候,该目录下的文件会映射至应用的根路径 / 下|-- utils                     常用函数存放目录|-- store                     数据状态管理目录| |-- modules| |-- types|-- .editorconfig             编辑器配置推荐|-- .eslintrc.js              eslint 配置文件|-- .gitignore                git 提交忽略文件|-- config.js                 项目配置文件|-- nuxt.config.js            用于组织 Nuxt.js 应用的个性化配置,以便覆盖默认配置|-- package.json              用于描述应用的依赖关系和对外暴露的脚本接口|-- README.md                 项目说明文件

依赖

  1. nuxt.js:基于vue的开发框架
  2. vue:JavaScript 渐进式框架
  3. vuex:状态管理
  4. vue-i18n:国际化
  5. jsonapi-vuex:允许通过 vuex store 访问 JSON:API web 服务中的数据。Discuz Q 接口使用的是 JSON:API 规范,所以使用这个库更加方便处理该请求和数据。
  6. nuxtjs-axios:基于 promise 的 HTTP 库
  7. element-ui:UI框架
  8. vue-cropper:图片裁剪插件
  9. v-viewer:图片点击放大预览插件
  10. xss:防xss注入插件
  11. dayjs:处理时间和日期的 JavaScript 库
  12. babel-plugin-transform-remove-console:用来移除项目中所有的 console 代码的插件

鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap