webpack打包单页面如何引用的js


Posted in Javascript onJune 07, 2017

目录结构如下图所示:

webpack打包单页面如何引用的js

webpack打包代码如下:

var webpack = require('webpack');
var fs = require('fs');
var path = require('path');
var fse = require('fs-extra');

const debug = process.env.NODE_ENV !== 'production';

function entries(jsPath) {
  var dirnames = fs.readdirSync(jsPath);

  var entries = {}, entry;

  for (var i = 0; i < dirnames.length; i++) {
    var dirname, basename;
    var jsList = [];
    dirname = dirnames[i];
    var files = fs.readdirSync(jsPath + '/' + dirname);
    for (var j = 0; j < files.length; j++) {
      entry = files[j];

      basename = path.basename(entry, '.js');
      jsList.push(path.join(jsPath, dirname, entry));
    }
    entries[path.join(dirname, 'app')] = jsList;
  }


  return entries;
}

var option = {
  entry: entries(__dirname + '/js/src'),
  output: {
    path: __dirname + '/dist/',
    filename: '[name].js'
  },
  plugins: [
    new webpack.optimize.UglifyJsPlugin({
      compress: {
        warnings: false
      }
    })
  ]
}
var compiler = webpack(option);
compiler.run(function() {
  fse.copy( __dirname + '/page/', __dirname + '/dist/');
  console.log('success');
});

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS 页面自动加载函数(兼容多浏览器)
May 18 Javascript
使用jQuery模板来展现json数据的代码
Oct 22 Javascript
js 链式延迟执行DOME
Jan 04 Javascript
jQuery学习笔记之jQuery.fn.init()的参数分析
Jun 09 Javascript
JS+CSS实现可拖拽的漂亮圆角特效弹出层完整实例
Feb 13 Javascript
继续学习javascript闭包
Dec 03 Javascript
基于vuejs+webpack的日期选择插件
May 21 Javascript
基于Node.js的WebSocket通信实现
Mar 11 Javascript
Node.js之网络通讯模块实现浅析
Apr 01 Javascript
vue路由嵌套的SPA实现步骤
Nov 06 Javascript
vue中使用vue-pdf的方法详解
Sep 05 Javascript
微信小程序实现星星评分效果
Nov 01 Javascript
vue使用Axios做ajax请求详解
Jun 07 #Javascript
Bootstrap fileinput文件上传组件使用详解
Jun 06 #Javascript
关于vue.js v-bind 的一些理解和思考
Jun 06 #Javascript
详解vue-cli开发环境跨域问题解决方案
Jun 06 #Javascript
JS实现微信里判断页面是否被分享成功的方法
Jun 06 #Javascript
详解Vue 开发模式下跨域问题
Jun 06 #Javascript
JS实现经典的中国地区三级联动下拉菜单功能实例【测试可用】
Jun 06 #Javascript
You might like
PHP session常见问题集锦及解决办法总结
2007/03/18 PHP
使用PHP实现阻止用户上传成人照片或者裸照
2014/12/25 PHP
QQ登录简单实现代码
2021/03/09 Javascript
通过继承IHttpHandle实现JS插件的组织与管理
2010/07/13 Javascript
jQuery EasyUI API 中文文档 - Pagination分页
2011/09/29 Javascript
js中哈希表的几种用法总结
2014/01/28 Javascript
JS 打印界面的CSS居中代码适用所有浏览器
2014/03/19 Javascript
json中换行符的处理方法示例介绍
2014/06/10 Javascript
JavaScript实现找出字符串中第一个不重复的字符
2014/09/03 Javascript
TypeScript 学习笔记之基本类型
2015/06/19 Javascript
JS实现点击按钮控制Div变宽、增高及调整背景色的方法
2015/08/05 Javascript
详解Bootstrap各式各样的按钮(推荐)
2016/12/13 Javascript
JavaScript实现的select点菜功能示例
2017/01/16 Javascript
详解webpack之scss和postcss-loader的配置
2018/01/09 Javascript
vue3.0 CLI - 1 - npm 安装与初始化的入门教程
2018/09/14 Javascript
vue图片加载失败时用默认图片替换的方法
2019/08/29 Javascript
关于vue项目中搜索节流的实现代码
2019/09/17 Javascript
p5.js实现故宫橘猫赏秋图动画
2019/10/23 Javascript
windows实现npm和cnpm安装步骤
2019/10/24 Javascript
vue+iview使用树形控件的具体使用
2020/11/02 Javascript
在vue中给后台接口传的值为数组的格式代码
2020/11/12 Javascript
python教程之用py2exe将PY文件转成EXE文件
2014/06/12 Python
python中利用zfill方法自动给数字前面补0
2018/04/10 Python
django settings.py 配置文件及介绍
2019/07/15 Python
Python类的继承super相关原理解析
2020/10/22 Python
html5 canvas实现圆形时钟代码分享
2013/12/25 HTML / CSS
美国皮靴公司自1863年:The Frye Company
2016/11/30 全球购物
美国知名生活购物网站:Goop
2017/11/03 全球购物
Skyscanner加拿大:全球旅行搜索平台
2018/11/19 全球购物
文言文形式的学生求职信
2013/12/03 职场文书
大学生职业生涯规划书
2014/03/14 职场文书
体育活动总结
2015/02/04 职场文书
体检通知范文
2015/04/21 职场文书
Python max函数中key的用法及原理解析
2021/06/26 Python
redis数据结构之压缩列表
2022/03/21 Redis
Oracle 11g数据库使用expdp每周进行数据备份并上传到备份服务器
2022/06/28 Oracle