vue如何设置login页面

第一次做一个从0开始的vue项目

之前都是接手的别人写好了框架的项目 或者是别人做了一半的项目

所以对有些东西还是一知半解

从零开始的就比较棘手一些了

从整体的框架到路由的配置（项目的路由有一些和其他的不太一样）

闲话不多说了直接开始正题

项目是vue2.0

这个项目做到差不多的时候

突然发现了一个比较致命的问题

那就是登陆页面的问题

之前都是写的.vue的文件

现在不行了 需要有一个单独的登陆页面 比如 login.html

让项目一运行就进入login.html

大家都知道 vue是单页面 运行会直接进入 index.html

所以需要增加一个入口来替代index.html

只有登陆了才可以进入index.html

那就需要去配置一下了

所以这里就需要去看一下我们的配置文件

这三个文件都是很重要的

因为本人也是小白一枚 所以还在研究当中

目前只能够把配置的地方给大家说一下

至于原理，大家可以自行百度一下或者问一下其他的大牛

首先 我们需要新建一个login.html   是和index.html 同级的 里面呢就是登录页

在static中建一个js文件夹  里面放login.js 当然 嫌麻烦也可以直接在页面中写方法

接下来 增加红色部分

代码：

new HtmlWebpackPlugin({
  filename: 'login.html',
  template: 'login.html',
  inject: true,
  chunks: ['login']
}),

接下来 修改红色部分

代码：

new HtmlWebpackPlugin({
  filename: process.env.NODE_ENV === 'testing'
    ? 'login.html'
    : config.build.login,
  template: 'login.html',
  chunks: ['vendor','manifest','login'],
  inject: true,
  minify: {
    removeComments: true,
    collapseWhitespace: true,
    removeAttributeQuotes: true
    // more options:
    // https://github.com/kangax/html-minifier#options-quick-reference
  },
  // necessary to consistently work with multiple chunks via CommonsChunkPlugin
  chunksSortMode: 'dependency'
}),
然后 打开

修改index.js

代码：

login: path.resolve(__dirname, '../dist/login.html'),

最后我是用了比较笨的方法来实现一进来就进入登录页
那就是在app.vue 中判断有没有登陆过

也可以尝试在路由中配置
因为能力有限，所以只能先这样了

如有错误还望多多指正，感激不尽