Fox3.0前端框架-调试开发说明

标签（空格分隔）： Fox

---

##1.路由配置

所有的路由配置必须在工程/src/route目录下面，路由文件的命名规范为 route-模块名.js 关于模块名的定义请参考文档“页面构造说明”，路由表为数组，并需要作为默认模块导出，如下：

import Login from "../page/common/login/index.vue";
import Frame from "../page/common/frame/index.vue";
//<import empty slot>
//路由表
let routes=[
    {
        path: '/',
        name: 'login',
        component: Login,

    },
    {
        path: '/frame',
        name: 'frame',
        component: Frame,
    }
    //<route empty slot>
];
//导出路由表
export default routes;

##2.入口文件配置 目前调试模式下使用的入口文件为工程/src/main-debug.js，新增的路由表需要在该文件进行注册

import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import i18n from './i18n/i18n'

//导入主题css
import "./assets/themes/main.css";
import "./assets/themes/blue/color-blue.css";
//安装Element UI
Vue.use(ElementUI);


//配置和mock数据
import '../config/config'
import '../mock'

import {fox, foxUI, foxPlugin} from './assets/libs/fox-libs'

//导入初始路由表
import routes from "./router/route-common";
//加入routes
fox.router.addRoutes(routes);

//安装Fox
Vue.use(fox);
//安装Fox插件
foxPlugin.install(fox, window, "fox");
//安装Fox UI
Vue.use(foxUI, {
    //head bar height
    headBarHeight:(70+34), //(标题栏高度+tab标签高度）
    //foot bar height
    footBarHeight:0,
});

//安装校验器
import ValidatorConfig from './utils/commons/validator'
ValidatorConfig.install(Vue, fox);

//加入请求过滤器
import ServiceFilter from './utils/commons/service-filter'
ServiceFilter.install(Vue, fox)

//------------------ debug router --------------------

//导入example路由表
import example_routes from './router/route-example'
//加入routes
fox.router.addRoutes(example_routes);

//导入template路由表
import template_routes from './router/route-template'
//加入routes
fox.router.addRoutes(template_routes);

//----------------------------------------------------


//导入App应用
import App from './App.vue'
new Vue({
    el: '#app',
    fox,
    i18n,
    components: { App },
    template: '<App/>'
})

下面两行代码为注册路由

//导入example路由表
import example_routes from './router/route-example'
//加入routes
fox.router.addRoutes(example_routes);

##3.配置文件 工程/config/config/.js 为工程的整体配置，如服务地址等。

//设置配置
const config={
    //APP名称
    app:"fox_base",
    // app:"services",
    //请求URL
    url:"139.199.79.118:9705",
    // url:"127.0.0.1:9705",
    //是否启用SSL
    ssl:false,
    //debug请求URL
    //debug_url:"192.144.128.218:9292",
    //是否启用debug SSL
    //debug_ssl:false,
    //web socket 通信方式
    webSocketType:"get",
    //默认root id
    defaultRootId:"_rootDiv",
    //首页
    startPage:"group",
    //录制模式
    recorderModel:false,
    //录制范围
    recorderScope:['fox.service'],
    //调试模式
    debugModel:false,
    //调试范围
    debugScope:['fox.service']
};

//设置配置
window.fox_GobaleConfig = config;

##4.调试开发

• 步骤1: 安装node 12.16
• 步骤2: 确认package.json中的依赖是否安装，可通过命令npm install 安装依赖库
• 步骤3: npm run debug 打开调试服务（工程根目录下执行）