怎么样给自己做网站,静态网页制作视频教程,网站文案框架,做网站怎么兼容所有浏览器文章目录 第一步#xff1a;在项目public文件夹下创建一个login.html#xff0c;其实就是将index.html复制一份#xff0c;将title改一下#xff1a;login.html 第二步#xff1a;在src文件夹下创建一个login文件夹#xff0c;分别创建login.main.js、login.router.js、l… 文章目录 第一步在项目public文件夹下创建一个login.html其实就是将index.html复制一份将title改一下login.html 第二步在src文件夹下创建一个login文件夹分别创建login.main.js、login.router.js、login.vue三个文件login.main.jslogin.router.jslogin.vue 第三步配置vue.config.js第四步运行访问第五步打包第六步部署nginx配置 由于vue为单页面项目通过控制组件局部渲染main.js是整个项目唯一的入口整个项目都在一个index.html外壳中。 若项目过大会造成单页面负载过重同时多页面利于模块独立部署。 如果项目中不同的页面需要不同的main.js和App.vue这样就需要配置多个入口了。 要单独将页面当成一个项目入口文件以下以登陆页面为例 第一步在项目public文件夹下创建一个login.html其实就是将index.html复制一份将title改一下 publicindex.htmllogin.htmllogin.html // 仿照index.html div idlogin/div第二步在src文件夹下创建一个login文件夹分别创建login.main.js、login.router.js、login.vue三个文件 srcloginlogin.main.jslogin.router.jslogin.vuelogin.main.js // 仿照main.js import Vue from vue; import login from ./login.vue; import router from ./login.router; Vue.config.productionTip false; new Vue({ router, render: h h(login), }).$mount(#login);login.router.js // 仿照router.js import Vue from vue; import Router from vue-router; Vue.use(Router); export default new Router({ routes: [{path: /,name: login,component: () import(../views/login.vue),meta:{title:登陆}},], });login.vue // 仿照App.vue template div idloginrouter-view/router-view/div /templatescript export default {data(){return{}} } /scriptstyle scoped/style第三步配置vue.config.js 在module.exports里加上入口配置 pages: {//配置多页面入口 login: { entry: src/login/login.main.js, template: public/login.html, }, index: { entry: src/main.js, template: public/index.html, }, },第四步运行访问 npm run serve这个就是单独的访问地址了 localhost:port/login.html 第五步打包 npm run build第六步部署nginx配置 root /usr/local/nginx/html; location /login {index login.html login.htm;try_files $uri $uri/ /login.html; } location / {index index.html index.htm;try_files $uri $uri/ /index.html; }这样就可以正常访问多个地址了。