当前位置:家常菜>百科>科技>正文

vue publicpath

人气:312 ℃/2023-03-29 05:57:25

vue怎么设置publicpath呢?不知道的小伙伴来看看小编今天的分享吧!

1、每次打包build完后,都单独生成一个/dist文件夹,且dist中每次都只有相同文件目录

2、部署的时候,是部署在服务器的一个/test文件夹下

打包后的文件目录:

1

2

3

4

5

├─dist

 ├─css

 ├─img

 └─js

 index.html

1、不设置publicPath时,部署后请求路径:

1

2

3

4

5

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

二、设置为/时,部署后请求路径:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<!DOCTYPE html><html lang=en><head>  <title>test</title>  <link href=/css/app.0b79487b.css rel=preload as=style>  <link href=/js/app.ba2d9b8a.js rel=preload as=script>  <link href=/js/chunk-vendors.e7ac9ff2.js rel=preload as=script>  <link href=/css/app.0b79487b.css rel=stylesheet></head><body><div id=app></div><script src=/js/chunk-vendors.e7ac9ff2.js></script><script src=/js/app.ba2d9b8a.js></script></body></html>

1

2

3

4

5

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<!DOCTYPE html><html lang=en><head>  <title>test</title>  <link href=/css/app.0b79487b.css rel=preload as=style>  <link href=/js/app.ba2d9b8a.js rel=preload as=script>  <link href=/js/chunk-vendors.e7ac9ff2.js rel=preload as=script>  <link href=/css/app.0b79487b.css rel=stylesheet></head><body><div id=app></div><script src=/js/chunk-vendors.e7ac9ff2.js></script><script src=/js/app.ba2d9b8a.js></script></body></html>

3、设置为./时,部署后请求路径:

1

2

3

4

5

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<!DOCTYPE html><html lang=en><head>  <title>test</title>  <link href=css/app.0b79487b.css rel=preload as=style>  <link href=js/app.8569d42d.js rel=preload as=script>  <link href=js/chunk-vendors.e7ac9ff2.js rel=preload as=script>  <link href=css/app.0b79487b.css rel=stylesheet></head><body><div id=app></div><script src=js/chunk-vendors.e7ac9ff2.js></script><script src=js/app.8569d42d.js></script></body></html>

4、设置为static时,部署后请求路径:

1

2

3

4

5

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<!DOCTYPE html><html lang=en><head>  <title>test</title>  <link href=static/css/app.0b79487b.css rel=preload as=style>  <link href=static/js/app.d0717808.js rel=preload as=script>  <link href=static/js/chunk-vendors.e7ac9ff2.js rel=preload as=script>  <link href=static/css/app.0b79487b.css rel=stylesheet></head><body><div id=app></div><script src=static/js/chunk-vendors.e7ac9ff2.js></script><script src=static/js/app.d0717808.js></script></body></html>

5、设置为./static时,部署后请求路径:

1

2

3

4

5

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<!DOCTYPE html><html lang=en><head>  <title>test</title>  <link href=static/css/app.0b79487b.css rel=preload as=style>  <link href=static/js/app.d0717808.js rel=preload as=script>  <link href=static/js/chunk-vendors.e7ac9ff2.js rel=preload as=script>  <link href=static/css/app.0b79487b.css rel=stylesheet></head><body><div id=app></div><script src=static/js/chunk-vendors.e7ac9ff2.js></script><script src=static/js/app.d0717808.js></script></body></html>

6、设置为../static时,部署后请求路径:

1

2

3

4

5

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<!DOCTYPE html><html lang=en><head>  <title>test</title>  <link href=../static/css/app.0b79487b.css rel=preload as=style>  <link href=../static/js/app.695b7ccc.js rel=preload as=script>  <link href=../static/js/chunk-vendors.e7ac9ff2.js rel=preload as=script>  <link href=../static/css/app.0b79487b.css rel=stylesheet></head><body><div id=app></div><script src=../static/js/chunk-vendors.e7ac9ff2.js></script><script src=../static/js/app.695b7ccc.js></script></body></html>

7、设置为../时,部署后请求路径:

1

2

3

4

5

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<!DOCTYPE html><html lang=en><head>  <title>test</title>  <link href=../css/app.0b79487b.css rel=preload as=style>  <link href=../js/app.67ace555.js rel=preload as=script>  <link href=../js/chunk-vendors.e7ac9ff2.js rel=preload as=script>  <link href=../css/app.0b79487b.css rel=stylesheet></head><body><div id=app></div><script src=../js/chunk-vendors.e7ac9ff2.js></script><script src=../js/app.67ace555.js></script></body></html>
  • 年届六十是什么意思

    年届六十是什么意思,一起来看看小编的分享吧!年届六十是年龄60。我国古代用干支记时间。所谓干支,是天干地支的简称。天干有十,地支十二,十天干和十二地支按照顺序搭配成六十个单位,...

    教育查看全文>>
  • 11款汉兰达油泵保险丝在哪里?

    11款汉兰达油泵保险丝在发动机舱内保险盒内,油泵是一种既轻便又紧凑的泵,有直列式、分配式和单体式三大类。油泵要有动力源才能运转,其下部的凸轮轴是由发动机曲轴齿轮带动的。以汉兰达...

    问答查看全文>>
  • 本田皓影和冠道有什么区别?

    本田冠道和本田全新车型皓影两款车级别不同,价格水平相差很多,本田冠道定位为中型SUV,本田皓影定位为紧凑型SUV,将在广汽推出,和本田CRV是兄弟车型,竞争对手是全新的丰田RA...

    问答查看全文>>
  • 醉驾怎么判断血检?

    醉驾判断血检方法:1、根据国家《车辆驾驶人员血液、呼气酒精含量阈值与检验》规定,100毫升血液中酒精含量达到20-80毫克的驾驶员即为酒后驾车,80毫克以上认定为醉酒驾车;2、...

    问答查看全文>>
  • 五四青年节简短文案

    1、青年节到了,祝你的生命像跳跃的音符轻快的旋律;工作像野猪一样勇往直前;才能像狮子一样统率一切;在家像黄牛一样勤勤恳恳;在外像猴子一样机灵。2、今日五四青年节,青春飘着旋律,...

    句子查看全文>>
本网站部分内容、图文来自于网络,如有内容侵犯您的合法权益,请及时与我们联系,我们将第一时间安排核实及删除!
CopyRight © 2007-2024 家常菜 All Rights Reserved. 手机版