bitorjs

bitorjs 可以帮助开发者更好地在 VUE & NODE 项目中快速集成插件式开发等功能

使用方法见文档

安装

npm i -S bitorjs

Bitorjs 做了什么

统一了项目目录划分
统一了配置方式
统一了中间件定义及使用
统一的 service 及 Mock
统一采用 webpack 去中心化 require.context 进行目录监听
统一使用注解进行路由注入
统一使用 webpack 进行代码处理

为什么要选择 Bitorjs

让项目迅速具有插件式插件功能
让你使用注解式路由
可与 node 开发统一开发习惯
增加前端中间件功能
service 与 mock 切换更方便

以上功能是能想到的, 更多功能及作用等你解锁

vue中使用

创建项目

使用 vue 官方脚手架 vue-cli

  $ vue init webpack xxx

安装依赖

  $ npm install -S bitorjs
  $ npm install -S vuex vuex-persist
  $ npm install -D babel-plugin-transform-decorators-legacy


  and add the following line to your .babelrc file:
  {
    "plugins": ["transform-decorators-legacy"]
}

修改

创建文件 config/index.env.js
修改文件 src/main.js

 // The Vue build version to load with the `import` command
 // (runtime-only or standalone) has been set in webpack.base.conf with an alias.
 import Vue from 'vue'
 import Application from 'bitorjs/vue';
 import App from './App'

 Vue.config.productionTip = false

 new Application({}, App, "#app").start(app => {
   app.watch(require.context('../config', false, /\.js$/))
   app.watch(require.context('.', true, /^((?!\/view\/).)+\.(vue|js)$/));
 })

修改文件 src/router/index.js

 import {
   Get,
   Controller
 } from 'bitorjs'

 import HelloWorld from '@/components/HelloWorld'

 @Controller('/')
 export default class {
   @Get('/')
   async index(ctx){
     ctx.render(HelloWorld)
   }
 }

到此, 改造完毕, 接下来,你就可以开启 bitorjs 之旅

Recommend Projects