goldencis-cli v3.0.4

前提

使用前提

1. 安装node.js且版本为14.x,16.x
2. git配备了环境变量

NPM配置

首次配置 输入npm config get 获取.npmrc地址 修改.npmrc 仓库地址

registry=http://10.10.15.50:8081/content/groups/npm-all/
@vue:registry=https://registry.npm.taobao.org
@babel:registry=https://registry.npm.taobao.org
@sindresorhus:registry=https://registry.npm.taobao.org

修改完成后在cmd中使用

npm i goldencis-cli -g 

安装完成后建议换回原来的仓库地址 registry = https://registry.npm.taobao.org

使用方式

初始化项目

goldencis init 项目名

如果需要设置50映射服务器地址则需

goldencis set 50服务器映射地址

说明

项目带自动生成路由模式和非自动生成路由模式

自动生成路由模式

let routes = autoRouter({ 
    // 页面级的.vue存放位置，必传
    rc: require.context('@/views', true, /\.vue$/),
    // '/'的重定向，可选，默认为''
    redirect: '/test',
    // 页面级的.vue存放的文件夹，可选，默认为:views
    rootFile: 'views',
})

基础路由

假设 views 的目录结构如下：

views/
--| login.vue
--| home.vue
--| user/
-----| index.vue
-----| edit.vue
-----| info.vue

那么，vue-router-auto 自动生成的路由配置如下：

[
    { 
        name:'login',
        path:'/login',
        component: () => import('@/views/login.vue')
    },
    { 
        name:'home',
        path:'/home',
        component: () => import('@/views/Home.vue')
    },
    { 
        name:'user',
        path:'/user',
        component: () => import('@/views/user/index.vue')
    },
    { 
        name:'user-info',
        path:'/user/info',
        component: () => import('@/views/user/info.vue')
    },
    { 
        name:'user-edit',
        path:'/user/edit',
        component: () => import('@/views/user/edit.vue')
    }
]

嵌套路由

假设 views 的目录结构如下：

views/
--| login.vue
--| home.vue
--| home/
-----| index.vue
-----| about.vue
-----| product.vue
--| user/
-----| index.vue
-----| info.vue

那么，vue-router-auto 自动生成的路由配置如下：

[
    { 
        name:'login',
        path:'/login',
        component: () => import('@/views/login.vue')
    },
    { 
        path:'/home',
        component: () => import('@/views/Home.vue'),
        children:[
            { 
                name:'home-index',
                path:'',
                component: () => import('@/views/home/index.vue')
            },
            { 
                name:'home-about',
                path:'about',
                component: () => import('@/views/home/about.vue')
            },
            { 
                name:'home-product',
                path:'product',
                component: () => import('@/views/home/product.vue')
            }
        ]
    },
    { 
        name:'user',
        path:'/user',
        component: () => import('@/views/user/index.vue')
    },
    { 
        name:'user-info',
        path:'/user/info',
        component: () => import('@/views/user/info.vue')
    }
]

动态嵌套路由

假设 views 的目录结构如下：

views/
--| login.vue
--| home.vue
--| home/
-----| _id.vue
-----| about.vue
--| user/
-----| user-edit.vue
 

那么，vue-router-auto 自动生成的路由配置如下：

[
    { 
        name:'login',
        path:'/login',
        component: () => import('@/views/login.vue')
    },
    { 
        name:'home',
        path:'/home',
        component: () => import('@/views/Home.vue'),
        children:[
            { 
                name:'home-id',
                path:':id',
                component: () => import('@/views/home/_id.vue')
            },
            { 
                name:'home-about',
                path:'about',
                component: () => import('@/views/home/about.vue')
            }
        ]
    },
    { 
        name:'user-edit',
        path:'/user/edit',
        component: () => import('@/views/user/user-edit.vue')
    }
]