vue模块整合后的一些问题

• 首先确保 router 配置使用的模式，一般情况下默认hash模式，如果是history，而且后台没有做配置，干掉
• 图片配置

config>index.js build对象

build: {
// Template for index.html
index: path.resolve(__dirname, '../dist/index.html'),

// Paths
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static',
assetsPublicPath: './', // 加上这句

build>utils.js

if (options.extract) {
      return ExtractTextPlugin.extract({

        use: loaders,

        publicPath: '../../', // 图片修改

        fallback: 'vue-style-loader'
      })
    } else {
      return ['vue-style-loader'].concat(loaders)
    }
}

• 路由守卫一定要return结束，生成环境下（即打包后）next()不会结束函数还会继续往下执行

router.beforeEach((to, from, next) => {
    
    if(to.path == '/Forget' || to.path == '/Login' || to.path == '/Register'){
        
        next();
        
        return;
    }
            
    if(localStorage.getItem('XG-TOKEN') == null){
            
        Toast('身份丢失，请重新登陆');
        
        next('/Login');
        
        return;
    }
    
    store.commit('settoken', localStorage.getItem('XG-TOKEN'));

    store.commit('setid', localStorage.getItem('user_id'));

    next();
    
    return;
    
});

• input类型
  一般情况下手机号、验证码使用number，但是在一些情况下不能使用number，如
  

  forget.png
  此时就不能使用number类型。

• other
  Chrome截取网页 打开检查，然后ctrl + shift + p，或者点右边那三个点，Dock silde
  

  image.png
  输入screen
  image.png
  captrue full size screenshot就是了

• other2
  关于命名规范有三种，PascalCase，kebab-case， camelCase，js中用的多的是camelCase
  vue风格指南

单文件组件的文件名应该要么始终是单词大写开头 (PascalCase)，要么始终是横线连接 (kebab-case)。

image.png