Vue项目搭建

解决ES6支持问题：

  main.js文件首行引入
       import 'babel-polyfill'
  build/webpack.base.conf.js文件中entry改为
       entry:{
           app:['babel-polyfill', './src/main.js']
       }

防止页面数据加载完全之前看见变量：

  App.vue文件引入样式
  [v-cloak] {
      display: none;
  }

路由设置：

  component:resolve => require(['@/components/Home.vue'],resolve)
  //滚动条的定位，配合meta标签设置，以及App.vue页面的keep-alive标签
  mode: 'history',
  routes,
  scrollBehavior(to,from,savedPosition){
    if(savedPosition){
        return savedPosition;
    }else{
        if(from.meta.keepAlive){
            from.meta.keepAlive = document.body.scrollTop
        }
        return { x:0, y:to.meta.savedPosition || 0 }
    }
  }
  //App.vue文件,如果需要渐隐渐现的效果，可以在外层包裹transition标签
  
      
  
  

   //当然也可以通过导航守卫控制
   router.afterEach((to,from,next) => {
       window.scrollTo(0,0);
   });

跨域访问：

  配置config/index.js中proxyTable对象
  proxyTable: {
      '/api':{
            target:'http://localhost:8080',
            pathRewrite:{
                '^/api':'/static/mock'
            }
      }
  }

如果需要更改项目访问地址：

  修改config/index.js文件：
      host可以更改主机访问IP
      port可以更改端口号
  如果希望同一网段的其他电脑可以访问本地项目：
      package.json文件启动服务加入：--host 0.0.0.0

如果希望项目启动时实时看到加载进度条：

  配置package.json文件启动服务时加入：--progress

如果希望可以省略的扩展名：

  配置build/webpack.base.conf.js文件
      extensions:['.js', '.vue', '.json']
  但是如果不写扩展名，会按照顺序进行查找，并且是依次向上进行查找
  这样会增加一点查找匹配的时间，因此过于后面的匹配建议还是补全扩展名

如果希望增加类似于'@'的语法糖(别名)：

  修改build/webpack.base.conf.js文件
      alias增加一条
  例如增加以下路径的简写方式
      alias:{
         'style': resolve('src/assets/styles')
      }

如果希望引入sass等CSS预处理器：

  配置build/webpack.base.conf.js文件
  module:{
      rules:[
           {
                test:/\.sass$/,
                loaders:['style', 'css', 'sass']
           }
      ]
  }

如果希望使用全局样式，全局变量或方法：

  配置build/utils.js文件
  exports.cssLoaders = function(options){
       //在这里加入以下内容
       const sassResourceLoader = {
            loader: 'sass-resources-loader',
            options: {
                  resources: [
                      //这里假设该路径下的variable.scss文件是要引入的全局文件
                      path.resolve(__dirname, '../src/assets/variable.scss')
                  ]
            }
        }
  }
  然后修改return中的内容
     sass: generateLoaders('sass', { indentedSyntax: true }).concat(sassResourceLoader),
     scss: generateLoaders('sass').concat(sassResourceLoader)

PS:上面这个本地运行没问题，但是部署到服务器上会报错。目前感觉可能是sass-loader加载顺序的问题，先记录一下，之后有时间研究。

暂时总结了以上内容，主要用于汇总记录，之后会继续补充。
前端小菜鸟，如果错误，请各位大佬指正。