Showing
6 changed files
with
149 additions
and
20 deletions
.gitignore
0 → 100644
src/http.js
0 → 100644
| 1 | +import axios from 'axios' | ||
| 2 | +import router from './router' | ||
| 3 | + | ||
| 4 | +// 请求拦截器 | ||
| 5 | +axios.interceptors.request.use( | ||
| 6 | + config => { | ||
| 7 | + // 发送请求前 | ||
| 8 | + return config; | ||
| 9 | + }, | ||
| 10 | + error => { | ||
| 11 | + // 请求错误处理 | ||
| 12 | + return Promise.reject(error); | ||
| 13 | + }) | ||
| 14 | + | ||
| 15 | +// 响应拦截器 | ||
| 16 | +axios.interceptors.response.use( | ||
| 17 | + response => { | ||
| 18 | + return response; | ||
| 19 | + }, | ||
| 20 | + error => { | ||
| 21 | + if (error.response) { | ||
| 22 | + switch (error.response.status) { | ||
| 23 | + case 401: | ||
| 24 | + router.replace({ | ||
| 25 | + path: '/login' | ||
| 26 | + }) | ||
| 27 | + break; | ||
| 28 | + case 404: | ||
| 29 | + router.replace({ | ||
| 30 | + path: '/' | ||
| 31 | + }) | ||
| 32 | + break; | ||
| 33 | + } | ||
| 34 | + } | ||
| 35 | + return Promise.reject(error.response.data); | ||
| 36 | + }) | ||
| 37 | + | ||
| 38 | +export default axios; |
src/route.js
0 → 100644
| 1 | import Vue from 'vue' | 1 | import Vue from 'vue' |
| 2 | -import Router from 'vue-router' | 2 | +import VueRouter from 'vue-router' |
| 3 | -import Home from './views/Home.vue' | 3 | +import ConfigRouter from './route.js' |
| 4 | 4 | ||
| 5 | -Vue.use(Router) | 5 | +Vue.use(VueRouter) |
| 6 | 6 | ||
| 7 | -export default new Router({ | 7 | +const router = new VueRouter({ |
| 8 | - routes: [ | 8 | + history: false, |
| 9 | - { | 9 | + hashbang: true, |
| 10 | - path: '/', | 10 | + base: __dirname, |
| 11 | - name: 'home', | 11 | + routes: ConfigRouter |
| 12 | - component: Home | ||
| 13 | - }, | ||
| 14 | - { | ||
| 15 | - path: '/about', | ||
| 16 | - name: 'about', | ||
| 17 | - // route level code-splitting | ||
| 18 | - // this generates a separate chunk (about.[hash].js) for this route | ||
| 19 | - // which is lazy-loaded when the route is visited. | ||
| 20 | - component: () => import(/* webpackChunkName: "about" */ './views/About.vue') | ||
| 21 | - } | ||
| 22 | - ] | ||
| 23 | }) | 12 | }) |
| 13 | + | ||
| 14 | +router.beforeEach((to, from, next) => { | ||
| 15 | + // store.commit('updateLoadingStatus', true) | ||
| 16 | + next() | ||
| 17 | +}) | ||
| 18 | + | ||
| 19 | +router.afterEach((to, from, next) => { | ||
| 20 | + // store.commit('updateLoadingStatus', false) | ||
| 21 | +}) | ||
| 22 | + | ||
| 23 | +export default router | ... | ... |
| 1 | <template> | 1 | <template> |
| 2 | <div class="home"> | 2 | <div class="home"> |
| 3 | + <x-header></x-header> | ||
| 3 | <img alt="Vue logo" src="../assets/logo.png"> | 4 | <img alt="Vue logo" src="../assets/logo.png"> |
| 4 | <HelloWorld msg="Welcome to Your Vue.js App"/> | 5 | <HelloWorld msg="Welcome to Your Vue.js App"/> |
| 5 | </div> | 6 | </div> |
| ... | @@ -8,11 +9,13 @@ | ... | @@ -8,11 +9,13 @@ |
| 8 | <script> | 9 | <script> |
| 9 | // @ is an alias to /src | 10 | // @ is an alias to /src |
| 10 | import HelloWorld from '@/components/HelloWorld.vue' | 11 | import HelloWorld from '@/components/HelloWorld.vue' |
| 12 | +import { XHeader } from 'vux' | ||
| 11 | 13 | ||
| 12 | export default { | 14 | export default { |
| 13 | name: 'home', | 15 | name: 'home', |
| 14 | components: { | 16 | components: { |
| 15 | - HelloWorld | 17 | + HelloWorld, |
| 18 | + XHeader | ||
| 16 | } | 19 | } |
| 17 | } | 20 | } |
| 18 | </script> | 21 | </script> | ... | ... |
vue.config.js
0 → 100644
| 1 | +const vuxLoader = require('vux-loader') | ||
| 2 | + | ||
| 3 | +module.exports = { | ||
| 4 | + // 基本路径 | ||
| 5 | + publicPath: process.env.NODE_ENV === 'production' | ||
| 6 | + ? '/' | ||
| 7 | + : '/boh/', | ||
| 8 | + // vux 相关配置,使用vux-ui | ||
| 9 | + configureWebpack: config => { | ||
| 10 | + vuxLoader.merge(config, { | ||
| 11 | + options: {}, | ||
| 12 | + plugins: ['vux-ui'] | ||
| 13 | + }) | ||
| 14 | + }, | ||
| 15 | + // 输出文件目录 | ||
| 16 | + outputDir: 'dist', | ||
| 17 | + // eslint-loader 是否在保存的时候检查 | ||
| 18 | + lintOnSave: true, | ||
| 19 | + // webpack配置 | ||
| 20 | + // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md | ||
| 21 | + chainWebpack: () => {}, | ||
| 22 | + // 生产环境是否生成 sourceMap 文件 | ||
| 23 | + productionSourceMap: true, | ||
| 24 | + // css相关配置 | ||
| 25 | + css: { | ||
| 26 | + // 是否使用css分离插件 ExtractTextPlugin | ||
| 27 | + extract: true, | ||
| 28 | + // 开启 CSS source maps? | ||
| 29 | + sourceMap: false, | ||
| 30 | + // css预设器配置项 | ||
| 31 | + loaderOptions: {}, | ||
| 32 | + // 启用 CSS modules for all css / pre-processor files. | ||
| 33 | + modules: false | ||
| 34 | + }, | ||
| 35 | + // use thread-loader for babel & TS in production build | ||
| 36 | + // enabled by default if the machine has more than 1 cores | ||
| 37 | + parallel: require('os').cpus().length > 1, | ||
| 38 | + // PWA 插件相关配置 | ||
| 39 | + // see https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa | ||
| 40 | + pwa: {}, | ||
| 41 | + // webpack-dev-server 相关配置 | ||
| 42 | + devServer: { | ||
| 43 | + open: process.platform === 'darwin', | ||
| 44 | + host: '0.0.0.0', | ||
| 45 | + port: 8080, | ||
| 46 | + https: false, | ||
| 47 | + hotOnly: false, | ||
| 48 | + proxy: null, // 设置代理 | ||
| 49 | + before: app => {} | ||
| 50 | + }, | ||
| 51 | + // 第三方插件配置 | ||
| 52 | + pluginOptions: { | ||
| 53 | + // ... | ||
| 54 | + } | ||
| 55 | +} |
-
Please register or login to post a comment