webpack配置上线地址主要使用output配置项下的publicPath

webpack.config.js配置文件为:

var htmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
//打包入口
entry: {
main: './src/js/main.js',
a: './src/js/a.js'
},
//打包后的文件
output: {
//不加__dirname 会报错
path: __dirname + '/dist',
//注意:使用[name]确保每个文件名都不重复
filename: 'js/[name]-[chunkhash].js',
//线上地址配置
publicPath:'http://cdn.com/'
},
plugins: [
new htmlWebpackPlugin({
template: 'index.html',
filename: 'index-[hash].html',
title: 'test parameter'
})
]
}

执行命令:

npm run webpack

效果:

(1)项目目录输出结构:

(2)html 引用地址为线上地址

webpack配置上线地址的更多相关文章

  1. 如何扩展 Create React App 的 Webpack 配置

    如何扩展 Create React App 的 Webpack 配置  原文地址https://zhaozhiming.github.io/blog/2018/01/08/create-react-a ...

  2. webpack+vue-cil 中proxyTable配置接口地址代理

    webpack+vue-cil 中proxyTable配置接口地址代理 在项目开发的时候,接口联调的时候一般都是同域名下,且不存在跨域的情况下进行接口联调,但是当我们现在使用vue-cli进行项目打包 ...

  3. webpack+vue-cli中proxyTable配置接口地址代理详细解释

    在vue-cli项目中config目录里面的index.js配置接口地址代理,详细解释如下图所示:

  4. Webpack配置示例和详细说明

    /* * 请使用最新版本nodejs * 默认配置,是按生产环境的要求设置,也就是使用 webpack -p 命令就可以生成正式上线版本. * 也可以使用 webpack -d -w 命令,生成用于开 ...

  5. vue-cli#2.0 webpack 配置分析

    目录结构: ├── README.md ├── build │ ├── build.js │ ├── check-versions.js │ ├── dev-client.js │ ├── dev-s ...

  6. vue-cli中webpack配置详解

    vue-cli是构建vue单页应用的脚手架,命令行输入vue init <template-name> <project-name>从而自动生成的项目模板,比较常用的模板有we ...

  7. vue-cli webpack配置 简单分析

    vue-cli webpack配置分析 入口 从package.json可以看到开发和生产环境的入口. "scripts": { "dev": "no ...

  8. webpack配置这一篇就够

    最近看了一篇好文,根据这个文章重新梳理了一遍webpack打包过程,以前的一些问题也都清楚了,在这里分享一下,同时自己也做了一些小的调整 原文链接:http://www.jianshu.com/p/4 ...

  9. 前端工程化(二)---webpack配置

    导航 前端工程化(一)---工程基础目录搭建 前端工程化(二)---webpack配置 前端工程化(三)---Vue的开发模式 前端工程化(四)---helloWord 继续上一遍的配置,本节主要记录 ...

随机推荐

  1. 在Win7环境下安装启动Linux

    在Win7环境下安装启动Linux 在Win7系统下,安装启动Linux特别的不方便,由于XP下的boot.ini配置文件不在了,要加入�一下启动选项的话, 仅仅能使用专门的工具,这或多或少给人带来不 ...

  2. IIS服务中五种身份验证

    转载:http://os.51cto.com/art/201005/202380.htm 作为微软最经典的Web服务之一的IIS服务有大致上五种Web身份认证方法.身份认证时保障IIS服务安全的根本, ...

  3. MySql 数据库导入"Unknown command '\n'."错误解决办法

    原文地址:http://www.cnblogs.com/bingxueme/archive/2012/05/15/2501999.html 在CMD 下 输入: Mysql -u root -p -- ...

  4. Java heap space 解决方法(转)

      因为程序要从数据读取近10W行记录处理,当读到9W的时候就出现 java.lang.OutOfMemoryError: Java heap space 这样的错误. 在网上一查可能是JAVA的堆栈 ...

  5. Java-JDBC调用批处理、存储过程、事务

    一.使用Batch批量处理数据库  当需要向数据库发送一批SQL语句执行时,应避免向数据库一条条的发送执行,而应采用JDBC的批处理机制,以提升执行效率.; 1.实现批处理有两种方式,第一种方式: S ...

  6. MapReduce任务分析与讨论MapReduce job explained

    In the last post we saw how to run a MapReduce job on Hadoop. Now we're going to analyze how a MapRe ...

  7. 编译打包工具sbt的镜像设置

    sbt可以和maven共用一个镜像,公司内部有的自然最后不过 创建文件:~/.sbt/repositories [repositories] local aliyun: http://maven.al ...

  8. 【BZOJ】【1419】Red is good

    数学期望/期望DP 还是戳<浅析竞赛中一类数学期望问题的解决方法>这篇论文…… $$ f[i][j]= \begin{cases} 0 &, &i==0 \\ f[i-1] ...

  9. 混沌数学之拉比诺维奇-法布里康特方程(Rabinovich-Fabrikant equations)

    拉比诺维奇-法布里康特方程(Rabinovich-Fabrikant equations)是 1979年苏联物理学家拉比诺维奇和法布里康特提出模拟非平衡介 质自激波动的非线性常微分方程组: dot{x ...

  10. 访问者模式讨论篇:java的动态绑定与双分派

    java的动态绑定 所谓的动态绑定就是指程执行期间(而不是在编译期间)判断所引用对象的实际类型,根据其实际的类型调用其相应的方法.java继承体系中的覆盖就是动态绑定的,看一下如下的代码: class ...