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. MySQL服务安装

    1.将mysql的安装文件放入服务器里面 2.进行yum源的修改 3.依次安装mysql的5个文件 最后一个server需要的依赖太多,所以用yum进行安装. 或者直接全部用yum进行安装 6.进行m ...

  2. javascript 体验倒计时:距离国庆还有多长时间

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Nginx 学习笔记(三)proxy_cache 缓存配置和ngx_cache_purge模块

    反向代理的缓存清理 一.proxy_cache配置 (1)如何配置和安装,都在这里了:https://github.com/Tinywan/Lua-Nginx-Redis/blob/master/Ng ...

  4. Socket 连接建立过程

    阻塞模式下: 1,客户端向服务器端发起请求建立连接时,服务器端只需要运行到 serverSocket = ); 客户端注册的  SelectionKey.OP_CONNECT 事件就能够发生. 也就是 ...

  5. u-boot移植(十三)---代码修改---裁剪及环境变量 一

    一.内核裁剪 内核的裁剪首先就是修改我们的配置文件,即 include/configs/jz2440.h 文件,里面定义的很多宏,我们也许用不上的就要去掉. /* * (C) Copyright 20 ...

  6. luogu P1627 [CQOI2009]中位数

    传送门 要求有多少个长度为奇数的区间满足某个数为区间中位数 这样的区间,大于中位数的数个数 等于 小于中位数的数个数 用类似于前缀和的方法,设\(X_i\)为\(i\)和数\(b\)形成的区间内,大于 ...

  7. 转载 int和string 类型的互换

    https://blog.csdn.net/u012421436/article/details/51386690 不论是在什么语言下编程(除C,因为C是没有string类型的),int与string ...

  8. mongodb系列~mongodb的副本集(1)

    一 简介: mongodb副本集 二 复制方式: 1 全量复制 2 增量复制三 同步检测过程:    一 正常情况下:       1 master执行语句,并将所有的修改数据库的操作以日志Oplog ...

  9. Android NetworkInterface 的 name

    user@android:/$ ls /sys/class/net/ dummy0 lo p2p0 rev_rmnet0 rev_rmnet1 rev_rmnet2 rev_rmnet3 rmnet0 ...

  10. Struts的JSON机制

    需要加入jar包 Struts的JSON帮助我们自动将对象解析为JSON对象,不用我门借助第三方进行JSON的解析 .具体的使用机制如下: 1.Action类 package StrutsJSON; ...