output: {

        filename: "[name].js",

        path:path.resolve(__dirname,"build")

    }

如果没有指定pubicPath,则引入路径如下

<body>

    <script src="b.js"></script>

</body>

如果有指定publicPath

output: {

        filename: "[name].js",

        path:path.resolve(__dirname,"build"),

        publicPath:"/assets/"

    }

则引入如下

<body>

    <script src="assets/b.js"></script>

</body>
webpack-dev-server环境下，path、publicPath、区别与联系

path：指定编译目录而已（/build/js/），不能用于html中的js引用。

publicPath：虚拟目录，自动指向path编译目录（/assets/ => /build/js/）。html中引用js文件时，必须引用此虚拟路径（但实际上引用的是内存中的文件，既不是/build/js/也不是/assets/）。

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

发布至生产环境：

1.webpack进行编译（当然是编译到/build/js/）

2.把编译目录（/build/js/）下的文件，全部复制到/assets/目录下（注意：不是去修改index.html中引用bundle.js的路径）

webpack——publicPath路径问题的更多相关文章

  1. webpack学习笔记——publicPath路径问题

    output: { filename: "[name].js", path:path.resolve(__dirname,"build") } 如果没有指定pu ...

  2. webpack配置路径及hash版本号，利用html-webpack-plugin自动生成html模板

    在项目中,因为需要经常更新文件,但是浏览器缓存问题导致js文件不是最新的,所有想办法添加hash值. 并配置webpack打包文件配置路径: 配置webpack打包文件路径,及非入口 chunk文件: ...

  3. webpack中路径的理解

    webpack 前端打包工具, 开发人员要面对的路径主要是: 打包前的路径(开发环境路径)和打包后的路径(生产环境路径) 在webpack.config.js中配置的output.path, outp ...

  4. publicPath路径问题

    output: { filename: "[name].js", path:path.resolve(__dirname,"build") } 如果没有指定pu ...

  5. webpack publicpath path

    一.publicpath 用绝对路径:如 /assets/ 会在支援路径前 加上 /assets/ devServer  publicpath 如果没有设置的话,取 publicpath 所以 一般要 ...

  6. 关于webpack一些路径

    好多新手对webpack中的路径一直感到迷茫,其实再学习webpack之前都应该去了解下nodejs的内容, 以为webpack就是个nodejs项目,所以里面涉及到的路径都是nodejs里面的写法 ...

  7. 理解webpack中的publicPath

    outPut中的publicPath 默认值: 空字符串. publicPath是非常有必要配置的,他是项目中引入静态资源(js.css)时的基础路径. 例如: outPut.publicPath = ...

  8. 基于webpack的vue项目路径别名

    在vue的项目里,我们可以使用../这样的相对路径的方式引用不同目录的组件: import userinfo from '../../../components/userinfo.vue'; 使用.. ...

  9. vue-cli的webpack模板项目配置文件分析

    由于最近在vue-cli生成的webpack模板项目的基础上写一个小东西,开发过程中需要改动到build和config里面一些相关的配置,所以刚好趁此机会将所有配置文件看一遍,理一理思路,也便于以后修 ...

随机推荐

  1. java代码示例（6-4）

    创建ChangePassword.java /** * 需求分析:修改用户密码 * @author chenyanlong * 日期:2017/10/15 */ package com.hp.test ...

  2. go 练习

    1.判断 101-200 之间有多少个素数,并输出所有素数 定义:为在大于1的自然数中,除了1和它本身以外不再有其他因数的数称为质数. package main import ( "fmt& ...

  3. Hibernate_事务管理

    今天学习Hibernate,发现当我在执行下面操作时,不会对数据库产生任何效果,就是说Customer对象并不会保存到数据库中 Session session = HibernateUtils.ope ...

  4. Error: failed to execute 'C:\Keil\ARM\ARMCC'的解决办法

    在KEIL新建工程时,容易出现该问题,我查了一些资料,最终找到该问题解决方法: 第一步:在keil里的菜单栏依次选择Project->Manage->Components,Environm ...

  5. 通过COM组件方式实现java调用C#写的DLL文件 转

    最近一段时间单位在做一个Web项目,工程师用JAVA语言,需要公用人员信息,统一用户名和密码,原有的平台中是用C#语言开发的,在网上查找解决方法,通过JAVA调用C#的DLL文件实现.网上资料很多,自 ...

  6. KillerBee

    KillerBee介绍 KillerBee----是攻击zigbee和IEEE 802.15.4网络的框架和工具.使用killerBee工具和一个兼容的IEEE 802.15.4无线接口,你就能窃取z ...

  7. Github安全整理（转载）

    刚好这两天对之前github上关注的一些比较有意思的项目进行了一下分类整理,在这里列出来分享给大家,希望能对大家寻找工具或者资源有所帮助. 大部分Repo是关于安全以及Python的,也有一些其他主题 ...

  8. [C++]Linux之图形界面编程库[curses库]之入门教程

    1. 安装 //方法一 sudo apt-get install libncurses5-dev [ ubuntu 16.04:亲测有效] //方法二 sudo apt-get install ncu ...

  9. python安装curses库

    windows系统在安装curses库时,如果直接使用conda或者pip安装,总是失败,到如下网址直接下载.whl文件,然后再用pip安装即可. https://www.lfd.uci.edu/~g ...

  10. Navicat Premium连接各种数据库

    版本信息 Navicat Premium 是一套数据库开发工具,让你从单一应用程序中同时连接 MySQL.MariaDB.SQL Server.Oracle.PostgreSQL 和 SQLite 数 ...