• vue-cli3.0 多页面和单页面的配置以及相互之间的切换


      在vue-cli3.0的脚手架中,创建了项目之后,很多配置都是都是已经生成了的,比如入口文件entry,和 output 等等都是已经设置好的,如果想要改动的话,我们需要添加 vue.config.js 去修改,在这里边官方提供了 publicPath 用来设置打包之后我们引入文件的路径,这里不支持相对路径,只能设置成觉得的路径,比如我们设置 publicPath: '/demo';那么我们打包之后的文件在 index.html 中去加载 css 的时候就是 link='/demo/css';还提供了 outputDir 来设置打包之后文件存放在哪里,默认的是放在 dist 下边的,这里我们也是可以去修改的;assetsDir 用来设置 css/js/img 等静态资源的存放位置

      如果我们要修改单页面应用的入口文件可以在 vue.config.js 中的 进行处理

    // vue.config.js
    
    module.exports = {
        configureWebapck: config => {
             config.entry.app = './src/index/main.js'   
        }    
    }

      如果我们要配置成多页面的应用的话只需要:

    // vue.config.js
    
    module.exports = {
        pages: {
           index: {
              entry: './src/index/main.js',
              template: './public/index.html',
              filename: 'index.html' 
           } ,
           sec: {
             entry: './src/sec/main.js',
             template: './public/index.html',
             filename: 'sec.html'
           }  
       }
    }

      如果想进行单页面和多页面的切换的话就只需要来修改 vue.config.js 的配置就可以了

  • 相关阅读:
    placeholder在ie浏览器里不显示的问题解决
    条件注释判断浏览器版本<!--[if lt IE 9]>
    在CSS中,BOX的Padding属性的数值赋予顺序为
    PhpStorm的注册码、Key
    关于【bootstrap modal 模态框弹出瞬间消失的问题】
    python 常见算法
    scrapy 爬虫基础
    python中的小知识点
    python 数据结构简介
    前端插件定制--表头和表内容
  • 原文地址:https://www.cnblogs.com/mufc/p/11665420.html
Copyright © 2020-2023  润新知