vue3.0 vue.config.js 配置

https://cli.vuejs.org/zh/config/#pages
vue3.0 vue.config.js,这个对比2.x版本少了很多东西,没有build的配置,也没有webpack的配置,
vue cli3.0项目中需要配置其他参数时,需要新建文件’vue.config.js’,(这文件名是固定这么写的),与package.json在同一级目录下。
3.0搭建的项目已经取消了config文件夹,所有配置都是在最外层的vue.config.js文件中进行配置

module.exports = {
	outputDir:"myProject" //打包后的项目目录名称
}

module.exports = {
    //   // 项目部署的基础路径
    // 我们默认假设你的应用将会部署在域名的根部,
    // 比如 https://www.my-app.com/
    // 如果你的应用时部署在一个子路径下,那么你需要在这里
    // 指定子路径。比如,如果你的应用部署在
    // https://www.foobar.com/my-app/
    // 那么将这个值改为 `/my-app/`
    publicPath: '/my-app/', 
    // 放置静态资源的地方 (js/css/img/font/...)
    assetsDir:'static',
    // 是否在保存的时候使用 `eslint-loader` 进行检查。
    // 有效的值:`ture` | `false` | `"error"`
    // 当设置为 `"error"` 时,检查出的错误会触发编译失败。
    lintOnSave: false,
    // 是否为生产环境构建生成 sourceMap
    //项目打包后,代码都是经过压缩加密的,如果运行时报错,输出的错误信息无法准确得知是哪里的代码报错。
    //也就是说map文件相当于是查看源码的一个东西。如果不需要定位问题,并且不想被看到源码,就把productionSourceMap 置为false,既可以减少包大小,也可以加密源码。
    productionSourceMap: false,
    outputDir: "nft", //打包后的项目目录名称
    //可以用来传递任何第三方插件选项
    pluginOptions: {
    	//配置全局less变量 style-resources-loader
        'style-resources-loader': {
            preProcessor: 'less',
            patterns: []
        }
    },
    devServer: {
        port: 8085, // 端口号
        host: 'localhost',
        open: true,//自动启动浏览器
        hotOnly: true,//是否热更新
        //配置跨域 在目标对象前设一个拦截层,因此也叫“代理器”。
        proxy: {
        	//表示以api开头的要用代理
            '/api': {
                target: 'http://45.105.124.130:8081',// 后台接口域名
                ws: true, //如果要代理 websockets,配置这个参数
                changeOrigin: true, //是否跨域
                secure: false,// 如果是https接口,需要配置这个参数
                pathRewrite: {
                    '^/api': '/api' 
                }
            }
        },
    }

};
当node服务器 遇到 以 '/api' 开头的请求,就会把 target 字段加上,那么我的请求地址就为 http://45.105.124.130:8081/api/xxxx/xxx
下面的 pathRewrite 表示的意思是 把/api 替换为 空,那么我的请求地址就为 http://45.105.124.130:8081/xxxx/xxx(用在如果你的实际请求地址没有 api的情况)
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值