vue搭建后台项目(代码片段)

//webpack.base.config.js
alias: 
  \'src\': path.resolve(__dirname, \'../src\'),
  \'components\': path.resolve(__dirname, \'../src/components\'),
  \'api\': path.resolve(__dirname, \'../src/api\'),
  \'utils\': path.resolve(__dirname, \'../src/utils\'),
  \'store\': path.resolve(__dirname, \'../src/store\'),
  \'router\': path.resolve(__dirname, \'../src/router\')


//使用xxx.js
import stickTop from \'components/stickTop\'
import getArticle from \'api/article\'

  "files.autoSave":"off",
  "eslint.validate": [
      "javascript",
      "javascriptreact",
      "html",
       "language": "vue", "autoFix": true 
    ],
    "eslint.options": 
      "plugins": ["html"]
  ,
  "eslint.autoFixOnSave": true

//webpack.prod.conf.js
var env = process.env.NODE_ENV === \'production\' ? config.build.prodEnv : config.build.sitEnv
new webpack.DefinePlugin(
  \'process.env\': env
)

//package.json
"scripts": 
  "dev": "node build/dev-server.js",
  "build:prod": "cross-env NODE_ENV=production node build/build.js",
  "build:sit": "cross-env NODE_ENV=sit node build/build.js"

//request.js
import axios from \'axios\'
import  Indicator, MessageBox  from \'mint-ui\'

// 创建axios实例
const service = axios.create(
  baseURL: process.env.BASE_API, // api的base_url
  timeout: 60000                  // 请求超时时间
)

// request拦截器
service.interceptors.request.use(config => 
  // Do something before request is sent
  Indicator.open(\'加载中...\')
  return config
, error => 
  // Do something with request error
  Promise.reject(error)
)

// respone拦截器
service.interceptors.response.use(
  response => 
    Indicator.close()
    const res = response.data
    if (res.ReturnCode !== \'000000\') 
      if (res.ReturnMsg) 
        MessageBox.alert(res.ReturnMsg)
       else 
        MessageBox.alert(\'系统未知错误\')
      
      return Promise.reject(res)
     else 
      return res
    
  ,
  error => 
    Indicator.close()
    MessageBox.alert(\'太火爆了吧，稍安勿躁，亲，再试试\')
    return Promise.reject(error)
  
)
export default service

//api/xxx.js
import request from \'@/utils/request\'

// 登录
export function userLogin(data) 
  return request(
    url: \'login.do\',
    method: \'post\',
    data
  )

//配置js1
var proxyMiddleware = require(\'http-proxy-middleware\');
var express = require(\'express\');
var app = express();
Object.keys(proxyTable).forEach(function (context) 
    var options = proxyTable[context]
    if (typeof options === \'string\') 
        options = target: options
    
    app.use(proxyMiddleware(options.filter || context, options))
);
//配置js2
proxyTable: 
    "/tt": 
        target: "http://localhost:8090",
        changeOrigin: true
    

//webpack.dev.config.js
devServer: 
  proxy: config.dev.proxyTable
,
//配置js
proxyTable: 
  "/portal": 
    target: "http://localhost:8080"
  

//permission.js
const whiteList = [\'/login\']// 不重定向白名单
router.beforeEach((to, from, next) => 
  NProgress.start() // 开启Progress
  const token = store.state.user.token
  if (token)  // 判断是否有token
    if (to.path === \'/login\') 
      next( path: \'/\' )
     else 
      store.dispatch(\'GenerateRoutes\').then(() =>  // 生成可访问的路由表
        router.addRoutes(store.getters.addRouters) // 动态添加可访问路由表
        next()
      )
    
   else 
    if (whiteList.indexOf(to.path) !== -1)  // 在免登录白名单，直接进入
      next()
     else 
      next(\'/login\') // 否则全部重定向到登录页！
    
  
)

//编译前
.example 
  color: red;

//编译后
.example[_v-f3f3eg9] 
  color: red;

.aritle-page //你的命名空间
    .el-tag  //element-ui 元素
      margin-right: 0px;
    

// 引入 ECharts 主模块
var echarts = require(\'echarts/lib/echarts\');
// 引入柱状图
require(\'echarts/lib/chart/bar\');
// 引入提示框和标题组件
require(\'echarts/lib/component/tooltip\');
require(\'echarts/lib/component/title\');

<!--components/Icon-svg-->
<template>
  <svg class="svg-icon" aria-hidden="true">
    <use :xlink:href="iconName"></use>
  </svg>
</template>

<script>
export default 
  name: \'icon-svg\',
  props: 
    iconClass: 
      type: String,
      required: true
    
  ,
  computed: 
    iconName() 
      return `#icon-$this.iconClass`
    
  

</script>

//引入svg组件
import IconSvg from \'@/components/IconSvg\'
//全局注册icon-svg
Vue.component(\'icon-svg\', IconSvg)
//在代码中使用
<icon-svg icon-class="password" />