您现在的位置是：网站首页> 编程资料编程资料

vue-cli中设置publicPath的几种方式对比_vue.js_

2023-05-24 385人已围观

简介 vue-cli中设置publicPath的几种方式对比_vue.js_

设置publicPath的几种方式对比

publicPath打包设置

1. 不设置(默认为 publicPath: ‘/’) 或者设置 publicPath: '/'

// vue.config.js module.exports = {   publicPath: '/', }

html中被打包的css和js路径如下

vue-manage-system-template-js

2.设置 publicPath: ‘./’ 好处是随处可打开,直接在打包文件夹就可打开html页面

// vue.config.js module.exports = {   publicPath: './', }

html中被打包的css和js路径如下

vue-manage-system-template-js

3.设置 publicPath: 'vmst’

// vue.config.js module.exports = {   publicPath: 'vmst', }

html中被打包的css和js路径如下

vue-manage-system-template-js

vue.config.js publicPath "./" npm run build无效

  • outputDir
  • assetsDir
  • indexPath

必须填

module.exports = { publicPath: process.env.NODE_ENV === 'production' ? './' : '/', outputDir: "dist", assetsDir:"static", indexPath:'index.html', devServer: { overlay: { warnings: false, errors: false }, // 设置主机地址 host: 'localhost', // 设置默认端口 port: 8080, // 设置代理 proxy: { '/api': { // 目标 API 地址 target: 'http://192.168.124.231:8707/', // 接口的域名 // 如果要代理 websockets ws: false, // 将主机标头的原点更改为目标URL changeOrigin: true } } } }

以上为个人经验，希望能给大家一个参考，也希望大家多多支持。

您可能感兴趣的文章:

上一篇：Vue出现弹出层时禁止底部页面跟随滑动_vue.js_

下一篇：JavaScript可视化与Echarts详细介绍_javascript技巧_

相关内容

点击排行

本栏推荐

猜你喜欢

-六神源码网