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 相关文章推荐
JavaScript显示当然日期和时间即年月日星期和时间
Oct 29 Javascript
escape编码与unescape解码汉字出现乱码的解决方法
Jul 02 Javascript
JavaScript link方法入门实例(给字符串加上超链接)
Oct 17 Javascript
教你使用javascript简单写一个页面模板引擎
May 05 Javascript
原生JS实现拖拽图片效果
Aug 27 Javascript
简单理解js的冒泡排序
Dec 19 Javascript
vue的状态管理模式vuex
Nov 30 Javascript
webpack4之SplitChunksPlugin使用指南
Jun 12 Javascript
微信小程序日期选择器实例代码
Jul 18 Javascript
基于vue中对鼠标划过事件的处理方式详解
Aug 22 Javascript
微信小程序实现评论功能
Nov 28 Javascript
Vue父组件监听子组件生命周期
Sep 03 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
深入array multisort排序原理的详解
2013/06/18 PHP
php中instanceof 与 is_a()区别分析
2015/03/03 PHP
护卫神php套件 php版本升级方法(php5.5.24)
2015/05/10 PHP
PHP实现四种基础排序算法的运行时间比较(推荐)
2016/08/11 PHP
PHP替换Word中变量并导出PDF图片的实现方法
2020/11/26 PHP
PHP的imageTtfText()函数深入详解
2021/03/03 PHP
Chrome中JSON.parse的特殊实现
2011/01/12 Javascript
通过下拉框的值来确定输入框是否可以为空的代码
2011/10/18 Javascript
为JavaScript类型增加方法的实现代码(增加功能)
2011/12/29 Javascript
jQuery操作input type=radio的实现代码
2012/06/14 Javascript
JS自动缩小超出大小的图片
2012/10/12 Javascript
从零学JS之你需要了解的几本书
2014/05/19 Javascript
微信小程序中hidden不生效原因的解决办法
2017/04/26 Javascript
浅谈React和Redux的连接react-redux
2017/12/04 Javascript
promise和co搭配生成器函数方式解决js代码异步流程的比较
2018/05/25 Javascript
解决eclipse中没有js代码提示的问题
2018/10/10 Javascript
NodeJs 模仿SIP话机注册的方法
2019/06/21 NodeJs
Tensorflow的可视化工具Tensorboard的初步使用详解
2018/02/11 Python
python 通过logging写入日志到文件和控制台的实例
2018/04/28 Python
详解Python字符串切片
2019/05/20 Python
Django ORM 自定义 char 类型字段解析
2019/08/09 Python
python/Matplotlib绘制复变函数图像教程
2019/11/21 Python
Python Gluon参数和模块命名操作教程
2019/12/18 Python
python属于哪种语言
2020/08/16 Python
美国孕妇装品牌:Destination Maternity
2018/02/04 全球购物
French Connection官网:女装、男装及家居用品
2019/03/18 全球购物
大二自我鉴定范文
2013/10/05 职场文书
机电一体化毕业生求职信
2013/11/02 职场文书
计算机专业职业规划
2014/02/28 职场文书
十八届三中全会感言
2014/03/10 职场文书
摄影专业毕业生求职信
2014/08/05 职场文书
员工离职证明范本
2015/06/12 职场文书
python入门之算法学习
2021/04/22 Python
Python破解极验滑动验证码详细步骤
2021/05/21 Python
Python超详细分步解析随机漫步
2022/03/17 Python
Python如何加载模型并查看网络
2022/07/15 Python