• Stars
    star
    256
  • Rank 159,219 (Top 4 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 9 years ago
  • Updated over 8 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Vue & Fis3 & Use Vue Component

fis3-vue

这个demo集成了目前前端开发比较流行的开源工具。 适用用于简单的前后端分离,移动端开发。

开发关键字:MVVM模块化ES6Combo自动化部署

另一套vue的解决方案:vue + vuex + vue-loader + webpack 组合 点击跳转查看


包括:

  • Node.js
  • Express
  • Fis3
  • Vue
  • Sass
  • PM2
  • Gulp
  • Babel
  • Webpack
  • BrowserSync

界面和样式是直接copy腾讯CDC的idesign.qq.com

截图


快速开始

// 安装fis及相关插件
npm i -g fis3 (需要3.0.7以上)

// 其他构建工具
npm i -g gulp
npm i -g webpack

// node调试工具
npm i -g node-dev
npm i -g node-inspector (如果在iojs环境安装失败,可以安装版本@0.9.2)

// 性能调优工具, 下载安装。
Mac: http://profiler.oss-cn-hangzhou.aliyuncs.com/node-profiler-v0.12.6.pkg
Win: http://profiler.oss-cn-hangzhou.aliyuncs.com/node-profiler-v0.12.6-x64.msi
npm run profiler

// 类似livereload的工具
npm i -g browser-sync

// 发布工具
npm i -g pm2

// 下载项目
git clone https://github.com/okoala/fis3-vue.git

// 运行项目
cd fis3-vue
npm install
npm run dev

// 需要预先配置好发布信息
// 初始化服务器环境
npm run setup

// 发布项目
npm run deploy

// 回滚操作
npm run revert

// 服务器启动/重启服务
npm run start

项目说明

1. 无分号,2Tab缩进.

2. 通过package.json的components字段,可以添加指定的库。例如:
  "components": [
    "vue",
    "vue-resource",
    "vue-router"
  ]
  说明指定vue,vue-resource,vue-router,这三个为前端库。
  使用的时候可以直接require('vue'),require('vue-resource')。
  当然你需要确认库是否已经在node_modules里了。

3. 通过配置config/config.json可以配置pm2相关设置,发布相关也在这个配置文件中.

4. 可以把图片命名为xxx.webp.jpg或xxx.webp.png
  这样可以同时生成webp和(png, jpg)两个版本的图片, 然后通过filter webp进行自动切换.

5. 新手可以使用我的编辑器配置:
  Sublime Text 3 for Mac: https://github.com/okoala/sublime-mac-bak.git
  Sublime Text 3 for Win: https://github.com/okoala/sublime-win-bak.git
  Atom for Mac: https://github.com/okoala/atom-mac-bak.git
  Atom for Win: https://github.com/okoala/atom-win-bak.git
  已经集成目前比较流行的插件~~项目解压覆盖到对应的文件, 然后重启编辑器即可.

More Repositories

1

vue-antd

Vue UI Component & Ant.Design
CSS
1,716
star
2

egg-jwt

JWT authentication plugin for egg
JavaScript
275
star
3

egg-vue-typescript-apollo-graphql-startkit

仅供参考,不要直接用于实际项目~
JavaScript
177
star
4

vue-vuex

Vue & Vuex & Express Hot-Reload
JavaScript
152
star
5

react-redux-antd

React & Redux & Ant.Design
JavaScript
135
star
6

xque

[WIP] (unofficial) an yuque app that builded by flutter
Dart
103
star
7

30DaysofReactNative

30 Days 30 React Native Project
JavaScript
87
star
8

awesome-stars

Awesome List of my own!
56
star
9

frontend-resources

平常收集的一些资源
49
star
10

docz-theme-yuque

Yuque theme for docz
TypeScript
25
star
11

egg-dingtalk-robot

钉钉机器人egg插件
JavaScript
23
star
12

hexo-theme-pithiness

the theme for hexo
CSS
20
star
13

webpack-prerender-spa-plugin

Prerender static html for spa application
JavaScript
18
star
14

react-native-starter

React Native + Redux + Code Push @ Android iOS Starter Kit
JavaScript
15
star
15

koa-jwt2

koa middleware that validates a JsonWebToken (JWT) and sync with express/jwt
JavaScript
14
star
16

sublime-win-bak

我的sublime win 备份
Python
10
star
17

fis3-parser-vue

fis3 parser vue
JavaScript
9
star
18

react-native-music

a music app like netease cloud music
JavaScript
8
star
19

remax-wechat-demo

Remax 微信小程序组件 / API / 云开发示例
JavaScript
8
star
20

egg-multiple-static

support multiple static server plugin for egg
JavaScript
7
star
21

vue-antd-docs-loader

vue antd docs webpack loader
JavaScript
7
star
22

react-native-redux-starter

react native redux demo
JavaScript
6
star
23

vue-apollo

Unofficial Vue2 integration for Apollo
JavaScript
5
star
24

backbone-0.9.9-zn

backbone 中文翻译文档
5
star
25

egg-swaggerbox

swagger box for egg
JavaScript
4
star
26

blog

我的博客
4
star
27

scrajs

[WIP] A scalable web crawler framework for Node.js
TypeScript
3
star
28

vueify-sync

vueify sync vueify 的同步版本
JavaScript
2
star
29

egg-neutrino

Neutrino Plugin for Egg.js
JavaScript
2
star
30

neutrino-preset-egg-typescript

Neutrino preset for supporting Egg.js build with typescript
JavaScript
2
star
31

slides

https://okoala.github.io/slides/2016-08-05-typescript/dist/public
JavaScript
2
star
32

egg-webpack-hot-middleware

JavaScript
1
star
33

okoala.github.com

Koala的博客
JavaScript
1
star
34

xbird

An new way to write mobile app
1
star
35

create-react-app

JavaScript
1
star
36

xfish

An new way to write cms by egg & umi & swagger
1
star
37

puppeteer-capture

JavaScript
1
star
38

egg-webpack-dev-middleware

JavaScript
1
star
39

enterprise-egg

[WIP] Egg.js 的企业级开发
1
star
40

pay

don't fork this project
Java
1
star
41

creative-egg

有关 Egg.js 的创意实践
TypeScript
1
star
42

babel-plugin-import-sideeffect

add import sideeffect plugin for babel
JavaScript
1
star
43

egg-pro

A REST and realtime API layer for modern applications build top of egg
1
star