BLOOK

GP's blog and book

vue2+vuex+axios+router初次分享

配置转发

  • 文件路径:config/index.js
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    port: 4444, // 端口
    proxyTable: {
    '/dev':{
    target: 'http://dev.api.pdb.com/http/',
    pathRewrite: {
    '^/dev': '' // 'dev'转换成空字符串
    },
    changeOrigin: true, // 代理转发
    }
    }

axios 发送 http

  • 文件路径:main.js
  1. 引用,依赖
1
2
3
import axios from 'axios'
import VueAxios from 'vue-axios'
Vue.use(VueAxios, axios)
  1. 全局配置,请求headers

    1
    2
    3
    4
    Vue.axios.defaults.baseURL = '/dev'
    Vue.axios.defaults.headers.common['X-Auth-Token'] = Vue.localStorage.get('token')
    Vue.axios.defaults.headers.common['X-Auth-Advertiser'] = '-1'
    Vue.axios.defaults.headers.common['content-type'] = 'application/x-www-form-urlencoded; charset=UTF-8'
  2. 全局配置,拦截器

    1
    2
    3
    4
    5
    6
    7
    //在发送请求之前做某事
    import Qs from "querystring"
    Vue.axios.interceptors.request.use(config=>{
    config.data = Qs.stringify(config.data)
    return config;
    })
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
//在得到响应之后做某事
Vue.axios.interceptors.response.use(response =>{
// 全局判断 code 码为0 直接return 需要使用的数据data
if(response.data.ret == 0) {
return response.data.data
} // 全局判断 code 码为1 跳到登录页
else if(response.data.ret == 1) {
window.location.href = response.data.data.url
return Promise.reject(response.data.msg)
} else {
// 不为0,把 msg, reject 到 error 层
return Promise.reject(response.data.msg)
}
})

html2jade用法总结

安装

1
npm install -g html2jade

参数说明

  • -d, –double - 为属性使用双引号
  • -o, –outdir - 输出生成的文件路径
  • -n, –nspaces - 缩进生成文件的空格数。默认为2个空格
  • –donotencode - 中文编码
  • –bodyless - 不包含 html + body 标签
  • –noattrcomma - 属性之间不要逗号分隔
  • –noemptypipe - omit lines with only pipe (‘|’) printable character 去掉|

yarn学习

命令

1
yarn init

当然可以加参数 –yes/-y 来自动回答所有的问题(yes),便捷的生成一个package.json

全局安装 yarn global add bagname

1
2
3
4
* yarn add --dev/-D 添加到devDependencies
* yarn add --peer/-P 添加到peerDependencies
* yarn add --optional/-O 添加到optionalDependencies

1
2
3
4
5
1. yarn bin将打印yarn将你的包里可执行文件安装到的目录。可以通过yarn bin 可执行脚本。
2. yarn cache ls (yarn 保存每个包到你的文件系统上用户目录里一个全局缓存里面。yarn cache ls会列出每个缓存了的包)
3. yarn cache dir(打印当前的yarn全局缓存在哪里)
4. yarn cache clean(运行这个命令会清除本地缓存,下次运行 yarn 或 yarn install 将会重新占用缓存。)
5. 设置yarn缓存路径(设置cache-folder来配置缓存目录。)

JS style

JavaScript Style Guide1.0

继承自airbnb的规范和angular最佳实践

  • TM组前端开发流程
  • 工具函数库
  • ES6
  • angular最佳实践
  • 常用工具函数和代码片段
  • js规范