画一生情入颜容
画一生情入颜容

手把手从0创建webpack并部署到本地服务器

webpack是js应用程序的静态资源的模块打包器，webpack在处理应用时，在内部会有一个各个模块的依赖图，然后将所有同类型的静态文件资源打包成一个或者多个bulder。
相信的初学者看到webpack是一脸懵逼，好不容易学会了一种前端框架，但在大型项目中的webpack也是必不可少的，所以有时候需要自己去动手改造一下webpack，接下来就是消除对webpack的恐惧和逃避心理，从建立一个js文件开始逐步实现webpack的打包以及部署到本地服务端。让你看到webpack不再逃避，而是很有兴趣去研究它。
手把手从0创建webpack并部署到本地服务器_第1张图片

这个是网上经常出现的关于webpack作用的形象图。
在使用的webpack4版本和以前的版本略有不同。

先下载webpack和webpac-cli，4版本以后，webpack-cli和webpack分开了，两者都使用全局安装
接下来创建一个文件夹，底下包含一个简单的html，js，css文件，这个就是我们从0实现webpack的打包部署的第一步。

简单的目录如下：手把手从0创建webpack并部署到本地服务器_第2张图片

index.js文件是项目的入口文件，所有有关的依赖都将在这个文件中进行处理。
middle.js是一个js文件，将被在index.js中调用。
style.css是一个css的样式文件，也将在index.js中引用。

    // miidle.js
    const json = {
        str : '第一个webpack打包文件'
    }
    moudule.exports = json
    // style.css
    .mian {
        background: '#f7f7f7',
        color: 'lightgreen'
    }
    // index.js
    const json = require('./middle.js')
    require('!style-loader!css-loader!./style.css')

    document.write(`<div class = 'main'>${json.str}div>')

由于webpack不支持非js文件的直接打包，所以我们需要对css进行打包的时候，使用style-loader和css-loader，顺序不能反。
先下载这两个依赖包，然后在进行引用，下载方法就是正常下载。不做介绍。
index.html中引入一个不存在的目录./dist/main.js’，先不要管，就这样用


<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Documenttitle>
  <script type = 'text/javascript' src = './dist/main.js'>script>
head>
<body>

body>
html>

完成之后，这四个文件进行保存，cd到文件夹下，webpack4现在不支持使用命令webpack a.js b.js的命令了。直接使用webpack index.js，按回车，就会发现项目下多出了一个dist文件夹，底下还有一个main.js文件，打开文件，看不懂。但是将index.html在浏览器中打开可以看到加了前景色和后景色的第一个webpack打包文件的字，和想象中是一样的。此时简单的一个webpack手动构建就完成了。

若还要引入第三方库，如jquery的时候，先下载npm install jquery
接下来在index.js中引入。

// index.js
    const json = require('./middle.js')
    require('!style-loader!css-loader!./style.css')
    const $ = require('jquery')
    document.write(`
class = 'main'>${json.str}</div>')
    $('.main').html('我是被jquery修改的内容').css({'background':'red'})

执行webpack index.js 重新打包一下，刷新浏览器，出现想要的结果，说明webpack打包引入第三方库也没有问题。

难道每次修改了文件就需要webpack index.js？ 更间接地方法就是，接下来npm init 一下，发现根目录下出现一个package.json, 在当前根目录下新建一个webpack.config.js，内容如下

    module.exports = {
      entry: './src/index.js',
      output: {
        path: __dirname+'/dist',
        filename:'main.js'
      },
       module: {
        rules: [{
          test: /\.css$/,
          loader: 'style-loader!css-loader'
        }]
      },
      devtool: 'eval-source-map'
    }

在这个里面有一个入口文件就是我们将所有东西都集中的文件，出口文件是dist/main.js。
module中的rules是数组，由于js不能直接处理非js文件，所以可以有多种加载器来进行转化，为js可以处理的文件。如vue-loader、sass-loader.
devtool, 是文件出错点击错误直接跳到出错对应的源码，否则会跳到编译后的main.js文件中，难定位错误。

{
        test: /\.js$/,
        loader: 'babel-loader',
        include: projectRoot,
        exclude: /node_modules/
      },
      {
        test: /\.html$/,
        loader: 'vue-html-loader',
        exclude: /node_modules/,
      },
      {
        test: /icons\/.*\.svg$/,
        loader: 'external-svg-sprite-loader',
        options: {
          name: 'static/img/sprite.svg',
          prefix: 'icon',
          svgoOptions: {
            plugins: [
              {
                removeTitle: true
              },
              {
                removeUselessStrokeAndFill: true
              }
            ]
          }
        }
      },
      {
        test: /\.(png|jpe?g|gif|svg|cur)(\?.*)?$/,
        exclude: /assets\/icons/,
        loader: 'url-loader',
        options: {
          limit: 10000,
          name: utils.assetsPath('img/[name].[hash:7].[ext]')
        }
      }

以上都是一些常用的loader和使用方法，其中的exclude就是不会匹配node_modules底下的文件，其他地方的文件都可以匹配到并进行loader转换。
好了，这个webpack.config.js目前是配置好了，再回到package.json中找到script字段，清空，在该字段下添加”dev”: “webpack”
进行以上修改配置后，在启动项目使用npm run dev这样就可以实现和webpack index.js一样的效果了。

但是我们又还想将这个项目部署到本地服务器，每次修改内容后，浏览器自动刷新的效果。
接下来就要说到webpack-dev-server了，它就是一个小型的服务器。忽然发现每次使用webpack init的vue项目可以跑在本地服务器上，应该就是webpack-dev-serverde作用吧。
接下来下载 npm install webpack-dev-server –save-dev -g
安装成功后你的node_modules和package.json中会出现webpack-dev-server文件夹或者文件名。

同样在package.json中的script中修改为这样

    "start": "webpack-dev-server --entry ./src/index.js --output-filename ./dist/main.js",
    "dev": "webpack  --watch"

启动两个服务，npm run dev
npm start // 默认启动8080端口，可以在webpack.config.js添加devServer{port：3000}修改端口号。

–watch的作用就是检测内容的变化，只要保存就会触发，服务器刷新，浏览器变化。
这样就实现了文件随时修改浏览器实时刷新。

webpack.config.js必须是这个名字吗？ 不一定，这只是默认的名字你可以修改为任何你认为有特定意义的名称。如webpack.base.config.js,但是在package.json中dev改成这样

 "dev": "webpack --config webpack.base.config.js --watch --mode development"

其实从一开始这个mode就必须指定，在webpack4版本后，不指定会有提示，

WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/concepts/mode/

其中可以指定为development或者production,即开发环境和生产环境。

开发环境与生产环境的区别
开发环境
NODE_ENV 为 development
启用模块热更新（hot module replacement）
额外的 webpack-dev-server 配置项，API Proxy 配置项
输出 Sourcemap
生产环境
NODE_ENV 为 production
将 React、jQuery 等常用库设置为 external，直接采用 CDN 线上的版本
样式源文件（如 css、less、scss 等）需要通过 ExtractTextPlugin 独立抽取成 css 文件
启用 post-css
启用 optimize-minimize（如 uglify 等）
中大型的商业网站生产环境下，是绝对不能有 console.log() 的，所以要为 babel

配置 Remove console transform

有时候一些项目中会出现三个webpack文件，一般为webpack.base.config.js、webpack.dev.config.js、webpack.prod.config.js。分别为开发环境和生产环境的通用配置，开发环境配置，生产环境配置。
后两者肯定是继承于前者的。

更详细的介绍参考https://zhuanlan.zhihu.com/p/29161762

你可能感兴趣的:(原创)

  • 实现音视频播放功能鸿蒙示例代码
    本文原创发布在华为开发者社区。介绍本示例基于Avplayer构建了一个音视频播放器，包括音视频的播放、暂停、全屏播放、倍速播放、快进等基本操作。实现音视频播放功能源码链接效果预览使用说明打开应用，展示视频播放器，选择不同按钮进行不同操作。切换音频，展示音频播放器，选择不同按钮进行不同操作。实现思路AVPlayer播放主流程播放的全流程包含：创建AVPlayer，设置播放资源，设置播放参数（音量/倍
  • 颜色一次性 wyz_666666 c++
    今天实在想不出做什么了，翻了翻小游戏，看到了原创的颜色一次性于是，就想到何不做这个呢???废话不多说，上代码！！！！！#include#includeusingnamespacestd;intmain(){cout>yanse;if(yanse==1){cout<<"跳转中......"<
  • 【SoC基础】第2节：CPU简介 望闻问嵌 #SoC单片机嵌入式硬件
    ：如果你也对机器人、人工智能感兴趣，看来我们志同道合✨：不妨浏览一下我的博客主页【https://blog.csdn.net/weixin_51244852】：文章若有幸对你有帮助，可点赞收藏⭐不迷路：内容若有错误，敬请留言指正！原创文，转载注明出处文章目录CPU结构设计CPU生产厂商CPU工作原理CPU的组成CPU的类型CPU内核与CPU的关系CPU内核种类参考CPU结构设计结构类型结构特点优点
  • 【SoC基础】单片机之RCC模块 望闻问嵌 #SoC单片机
    ：如果你也对机器人、人工智能感兴趣，看来我们志同道合✨：不妨浏览一下我的博客主页【https://blog.csdn.net/weixin_51244852】：文章若有幸对你有帮助，可点赞收藏⭐不迷路：内容若有错误，敬请留言指正！原创文，转载注明出处RCC模块简介RCC（ResetandClockControl）即复位和时钟控制模块，其基本功能总结如下：时钟源管理多源选择：支持多种时钟源，包含内部
  • 实现音视频录制功能鸿蒙示例代码
    本文原创发布在华为开发者社区。介绍本示例基于AVRecorder实现音视频录制，包括开始录制、暂停、结束、上一个等几乎所有录制音视频的基本操作。实现音视频录制功能源码链接效果预览使用说明打开应用，展示视频录制和音频录制两个按钮。点击视频录制即可录制视频，并会保存视频。点击音频录制按钮即可开始录制音频，并会保留音频文件，点击文件可以进行播放。实现思路构建音频录制页面构造setAudioRecorde
  • 实现音视频录制功能鸿蒙示例代码
    本文原创发布在华为开发者社区。介绍本示例基于AVRecorder实现音视频录制，包括开始录制、暂停、结束、上一个等几乎所有录制音视频的基本操作。实现音视频录制功能源码链接效果预览使用说明打开应用，展示视频录制和音频录制两个按钮。点击视频录制即可录制视频，并会保存视频。点击音频录制按钮即可开始录制音频，并会保留音频文件，点击文件可以进行播放。实现思路构建音频录制页面构造setAudioRecorde
  • 实现短视频播放功能鸿蒙示例代码
    本文原创发布在华为开发者社区。介绍本示例使用Swiper+AVPlayer构建了一个短视频上下滑动并播放的场景。实现短视频播放功能源码链接效果预览使用说明打开应用，直接播放第一条短视频。向上滑动，即可进入第二条短视频，之后可以上下滑动播放短视频。实现思路数据处理构造BasicDataSource类，实现对数据的处理函数。classBasicDataSourceimplementsIDataSour
  • 添加视频播放进度条鸿蒙示例代码
    本文原创发布在华为开发者社区。介绍本示例构建了一个视频播放进度条案例，主要实现的功能是为正在播放的视频添加一个刻度条组件用以表示进度。添加视频播放进度条源码链接效果预览使用说明打开应用，展示待播放的视频以及播放、暂停两个按钮。点击播放按钮，视频播放，刻度条会随视频的进度条而移动。拖动刻度条也可以视频进度进行拖动。实现思路利用videoController简单的设置video的播放、暂停按钮控制。B
  • 系统应用权限设置跳转鸿蒙示例代码
    本文原创发布在华为开发者社区。介绍本示例基于设置应用实现引导用户跳转到系统设置页进行权限，通知的相关设置，包含以下两个场景。场景一：如果应用首次拒绝了消息通知，应用希望能够引导用户拉起设置应用设置允许通知，用来接收应用内的推送消息；并且在设置完后返回页面可以监听到修改后的状态。场景二：当用户使用一些需要用户授权的api时（如访问获取联系人信息），若用户首次拒绝授权，则需要引导用户到权限设置页面能够
  • 实现组件裁剪鸿蒙示例代码
    本文原创发布在华为开发者社区。介绍对Image组件设置clipShape属性，并通过PathShape传入不同的裁剪命令，将Image组件裁剪为不同形状。使用Path组件，通过设置commands属性，并传入不同的绘制命令，绘制出带圆角的不同形状的组件。实现组件裁剪源码链接效果预览使用说明安装到手机后点击应用图标即可进入本应用。点击不同按钮，查看clipShape裁剪组件和Path绘制圆角形状组件
  • 【无标题】 退思精舍 r语言
    一个农民企业家的家国情怀/作者：杨桂林高朵芬原创新时代报告文学文学新军2022-03-2809:41——谨以此文献给内蒙古佘太酒业成立十周年，并向为佘太酒业发展、壮大做过贡献的人们致敬！刚过完一九七九年春节，塞哈拉脚下的各个村落还没有开工，每家每户门窗上的红对联也未被强烈的沙尘暴刮走，那些脱光了叶子只剩下树干的白杨树，尽管抖起精神来，也抵挡不住北国的严寒，大地灰蒙蒙一片，好像万事万物依然沉浸在早春
  • 实现图片计数功能鸿蒙示例代码
    本文原创发布在华为开发者社区。介绍本项目基于Canvas组件进行图片计数、图片局部涂鸦遮盖、图片局部自动绘制圆圈路径功能实现：支持图片内部圆圈计数，可通过按钮增加或减少已有数值。支持画笔对图片进行局部涂鸦遮盖，可切换画笔颜色以及线条粗细程度，可用橡皮擦功能撤销当前涂鸦路径支持图片局部自动绘制圆圈路径并填充颜色以及数字标识，可调整切换圆圈路径底部颜色实现图片计数功能源码链接效果预览使用说明打开应用，
  • 实现录屏功能鸿蒙示例代码
    本文原创发布在华为开发者社区。介绍本示例基于C侧AVScreenCapture模块API实现视频录制功能，并将生成的录屏文件保存到到沙箱目录。实现录屏功能源码链接效果预览使用说明点击“startcapture”按钮弹出是否允许应用使用屏幕的弹窗，点击允许开始屏幕录制。点击“stopcapture”按钮，屏幕录制停止，并生成录屏文件保存到沙箱目录。实现思路通过调用AVScreenCapture模块下
  • 实现拍照、录音功能鸿蒙示例代码
    本文原创发布在华为开发者社区。介绍本示例演示如何使用Web组件拍照和录音。web拉起系统相机拍照，并返回base64数据给web页面。web调用麦克风录音，并保持录音文件到指定沙箱目录。实现拍照、录音功能源码链接效果预览使用说明web调用相机拍照：打开应用后，点击“拍照按钮”在拉起的系统相机中进行拍照拍照完成后web网页会获取到base64数据web调用麦克风录音：打开应用后，点击“开始录音”一段
  • Cisco ASA 9.23.1 - 思科自适应安全设备 (ASA) 软件 cisco
    CiscoASA9.23.1-思科自适应安全设备(ASA)软件CiscoAdaptiveSecurityAppliance(ASA)请访问原文链接：https://sysin.org/blog/cisco-asa/查看最新版。原创作品，转载请保留出处。作者主页：sysin.org思科自适应安全设备(ASA)软件成熟的防火墙和网络安全平台CiscoASA系列安全设备可以保护各种规模的公司网络。它可让
  • 利用NFC增强用户体验：HarmonyOS Next的NFC应用指南 SameX-4869 uxharmonyos华为
    本文旨在深入探讨华为鸿蒙HarmonyOSNext系统（截止目前API12）的技术细节，基于实际开发实践进行总结。主要作为技术分享与交流载体，难免错漏，欢迎各位同仁提出宝贵意见和问题，以便共同进步。本文为原创内容，任何形式的转载必须注明出处及原作者。在智能设备的交互领域，NFC（NearFieldCommunication，近场通信）技术以其便捷、快速的特点，为用户带来了诸多便利。HarmonyO
  • IPC Kit基础入门：理解HarmonyOS的进程间通信架构 SameX-4869 harmonyos架构华为
    本文旨在深入探讨华为鸿蒙HarmonyOSNext系统（截止目前API12）的技术细节，基于实际开发实践进行总结。主要作为技术分享与交流载体，难免错漏，欢迎各位同仁提出宝贵意见和问题，以便共同进步。本文为原创内容，任何形式的转载必须注明出处及原作者。在HarmonyOS应用开发中，进程间通信（IPC）是构建复杂应用架构的关键要素。IPCKit为开发者提供了强大的进程间通信能力，使不同进程之间能够高
  • Android15音频进阶之qnx定位so调用进程(一百一十一) Android系统攻城狮 AndroidAudio工程师进阶系列音视频Android15QNX音频调试
    简介：CSDN博客专家、《Android系统多媒体进阶实战》一书作者新书发布：《Android系统多媒体进阶实战》优质专栏：Audio工程师进阶系列【原创干货持续更新中……】优质专栏：多媒体系统工程师系列【原创干货持续更新中……】优质视频课程：AAOS车载系统+AOSP14系统攻城狮入门视频实战课
  • uv：颠覆你的Python项目管理，速度提升10-100倍 强化学习曾小健2 uvpython开发语言
    uv：颠覆你的Python项目管理，速度提升10-100倍原创工业开源好项目工业开源好项目2025年01月05日00:01湖南Python生态系统繁荣的同时，也带来了一些挑战：繁多的包管理工具、缓慢的依赖安装速度、以及复杂的虚拟环境管理。面对这些问题，uv应运而生。它是一个用Rust编写的高性能Python包和项目管理器，旨在以更快的速度、更简洁的方式，解决Python开发中的诸多痛点。本文将详细
  • 计算机毕设论文灵魂模块：系统架构图设计终极指南（附资料） 计算机毕业设计小帅 课程设计毕业设计java系统架构
    【关注我，毕业设计不迷茫】|6年辅导经验|帮助1200+学子顺利毕业大家好，我是程序员小帅，一名专注于计算机毕业设计全流程辅导的技术博主。专注JavaWeb,我深耕毕设领域6年，累计输出1200+原创项目案例，辅导成功率接近100%。如果你正在为选题、代码、论文或答辩发愁，这里能给你最落地的解决方案！为什么架构图是毕设的灵魂？1️⃣展示系统思维：用一张图说清技术选型逻辑2️⃣设计说明书：开发前必须
  • Cisco ACI Simulator 6.0(9c)M - ACI 模拟器 cisco
    CiscoACISimulator6.0(9c)M-ACI模拟器ApplicationCentricInfrastructure(ACI)SimulatorSoftware请访问原文链接：https://sysin.org/blog/cisco-acisim-6/查看最新版。原创作品，转载请保留出处。作者主页：sysin.orgACISimulator介绍思科以应用为中心的基础设施(ACI)被概念
  • Omnissa Horizon 8 2412 (8.14) - 虚拟桌面基础架构 (VDI) 和应用软件 虚拟化
    OmnissaHorizon82412(8.14)-虚拟桌面基础架构(VDI)和应用软件之前称为VMwareHorizon,通过高效、安全的虚拟桌面交付增强您的工作空间请访问原文链接：https://sysin.org/blog/omnissa-horizon-8/查看最新版。原创作品，转载请保留出处。作者主页：sysin.orgHorizon8formerlyVMwareHorizon通过从本地
  • 【prompt实战】知乎问题解答专家 姚瑞南 prompt实战应用案例prompt
    本文原创作者：姚瑞南AI-agent大模型运营专家，先后任职于美团、猎聘等中大厂AI训练专家和智能运营专家岗；多年人工智能行业智能产品运营及大模型落地经验，拥有AI外呼方向国家专利与PMP项目管理证书。（转载需经授权）#Role:知乎问题解答分类专家##Profile:你是一个知乎问题解答分类专家，主要帮助用户解答各类领域专业问题，包括但不限于金融领域、职场问题、互联网领域、科技领域、人工智能领域
  • 【原创】Linux上普通用户安装、运行nmap功能扫描指定IP地址上的端口 赵庆明老师 Linuxlinuxtcp/ip运维
    由于是普通用户，因此权限受限，基本上不用考虑常规途径安装了。加上服务器操作系统可能比较老，如果使用源码编译的话，可能会有一大堆编译错误，且由于权限问题，无法解决。这里我要用到一个工具：nmap，扫描某主机。登录nmap官网https://nmap.org/点击下载https://nmap.org/download.html点击Linux版的nmap,下载rpm安装包下载完后，上载到服务器。使用以下
  • 一次 诡异 的 JVM OOM 事故 原创 程序员小2 mysql
    当面对JVMOOM时，你会紧张吗？会不会手足无措？这篇文章，分享前段时间帮一位同学梳理面对JVMOOM事故时的解题思路。首先从对话中，我们可以看到内存溢出呈现两种情况：运行一段时间之后，CPU飙高；服务假死，表现出来日志没有任何输出。我的第一反应是：非常明显的JVM内存溢出表现，不过不知道是爆炸性的内存增长，还是缓慢的内存增长。于是，我回复：可以每隔一段时间观察top-pPid（进程号）看看应用的
  • 吴恩达的翻译Agent项目，复现教程来了！ datawhale
    原创郭才高DatawhaleDatawhale教程作者：郭才高，Datawhale创作者1.TranslationAgent复现效果展示#执行任务#调用编译后的工作流，传入初始状态字典result=app.invoke({   "source_lang": "English", #源语言为英语   "target_lang": "中文",  #目标语言为中文   "source_text": ""
  • 4.2.3 键值对集合2 .Net学习 C#教程c#开发语言
    版权声明：本文为博主原创文章，转载请在显著位置标明本文出处以及作者网名，未经作者允许不得用于商业目的4.2.3.3KeyValuePair结构KeyValuePair结构定义可设置或检索的键/值对。通常在KeyValuePair的构造函数中传入键和值作为参数，例如下面的语句定义了键为int、值为string的KeyValuePair，并赋予了初始值：KeyValuePairnewKeyValueP
  • RV1126笔记三十七：PaddleOCR检测模型训练 殷忆枫 RV1126项目实战笔记
    若该文为原创文章，转载请注明原文出处。PaddleOCR检测模型训练及验证测试1、准备数据集在PaddleOCR目录下新建文件夹：train_data,这个文件夹用于存放数据集的。使用的是网上大佬提供的车牌识别数据集，下载后，解压到train_data目录下。可以自己网上找，了可以找我要数据集，或自己标注数据集。2、配置文件在PaddleOCR主目录下：configs/det/ch_ppocr_v
  • HTML网页中添加视频的代码 冬瓜生鲜 JavaWeb
           //非原创（当时忘记保存大佬连接了，不知道是谁的了，所以没有转载链接，见谅）只需要把名字改改就行如果要实现自动播放：改下这个：controlsautoplaymuted;       
  • 实现相机权限二次申请鸿蒙示例代码
    本文原创发布在华为开发者社区。介绍本示例基于程序访问控制管理实现二次向用户申请相机访问权限授权。实现相机权限二次申请源码链接效果预览使用说明点击“RequestPermission”按钮，出现弹窗向用户申请相机访问权限授权，点击“不允许”，再次点击“RequestPermission”按钮，出现半屏弹窗二次向用户申请授权。实现思路点击“RequestPermission”按钮时，通过request
  • jdk tomcat 环境变量配置 Array_06 javajdktomcat
    Win7 下如何配置java环境变量 1。准备jdk包，win7系统，tomcat安装包（均上网下载即可） 2。进行对jdk的安装，尽量为默认路径（但要记住啊！！以防以后配置用。。。） 3。分别配置高级环境变量。   电脑-->右击属性-->高级环境变量-->环境变量。 分别配置 : path    &nbs
  • Spring调SDK包报java.lang.NoSuchFieldError错误 bijian1013 javaspring
            在工作中调另一个系统的SDK包，出现如下java.lang.NoSuchFieldError错误。 org.springframework.web.util.NestedServletException: Handler processing failed; nested exception is java.l
  • LeetCode[位运算] - #136 数组中的单一数 Cwind java题解位运算LeetCodeAlgorithm
    原题链接：#136 Single Number 要求： 给定一个整型数组，其中除了一个元素之外，每个元素都出现两次。找出这个元素 注意：算法的时间复杂度应为O(n)，最好不使用额外的内存空间 难度：中等 分析： 题目限定了线性的时间复杂度，同时不使用额外的空间，即要求只遍历数组一遍得出结果。由于异或运算 n XOR n = 0, n XOR 0 = n，故将数组中的每个元素进
  • qq登陆界面开发 15700786134 qq
    今天我们来开发一个qq登陆界面，首先写一个界面程序，一个界面首先是一个Frame对象，即是一个窗体。然后在这个窗体上放置其他组件。代码如下： public class First {         public void initul(){        jf=ne
  • Linux的程序包管理器RPM 被触发 linux
    在早期我们使用源代码的方式来安装软件时，都需要先把源程序代码编译成可执行的二进制安装程序，然后进行安装。这就意味着每次安装软件都需要经过预处理-->编译-->汇编-->链接-->生成安装文件--> 安装，这个复杂而艰辛的过程。为简化安装步骤，便于广大用户的安装部署程序，程序提供商就在特定的系统上面编译好相关程序的安装文件并进行打包，提供给大家下载，我们只需要根据自己的
  • socket通信遇到EOFException 肆无忌惮_ EOFException
    java.io.EOFException at java.io.ObjectInputStream$PeekInputStream.readFully(ObjectInputStream.java:2281) at java.io.ObjectInputStream$BlockDataInputStream.readShort(ObjectInputStream.java:
  • 基于spring的web项目定时操作 知了ing javaWeb
    废话不多说，直接上代码，很简单 配置一下项目启动就行 1，web.xml <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="h
  • 树形结构的数据库表Schema设计 矮蛋蛋 schema
    原文地址： http://blog.csdn.net/MONKEY_D_MENG/article/details/6647488     程序设计过程中，我们常常用树形结构来表征某些数据的关联关系，如企业上下级部门、栏目结构、商品分类等等，通常而言，这些树状结构需要借助于数据库完成持久化。然而目前的各种基于关系的数据库，都是以二维表的形式记录存储数据信息，
  • maven将jar包和源码一起打包到本地仓库 alleni123 maven
    http://stackoverflow.com/questions/4031987/how-to-upload-sources-to-local-maven-repository <project> ... <build> <plugins> <plugin> <groupI
  • java IO操作 与 File 获取文件或文件夹的大小，可读，等属性！！！ 百合不是茶
    类 File File是指文件和目录路径名的抽象表示形式。 1，何为文件： 标准文件（txt doc mp3...） 目录文件（文件夹） 虚拟内存文件   2，File类中有可以创建文件的 createNewFile（）方法,在创建新文件的时候需要try{} catch(）{}因为可能会抛出异常；也有可以判断文件是否是一个标准文件的方法isFile();这些防抖都
  • Spring注入有继承关系的类（2） bijian1013 javaspring
    被注入类的父类有相应的属性，Spring可以直接注入相应的属性，如下所例：1.AClass类 package com.bijian.spring.test4; public class AClass { private String a; private String b; public String getA() { retu
  • 30岁转型期你能否成为成功人士 bijian1013 成长励志
            很多人由于年轻时走了弯路，到了30岁一事无成，这样的例子大有人在。但同样也有一些人，整个职业生涯都发展得很优秀，到了30岁已经成为职场的精英阶层。由于做猎头的原因，我们接触很多30岁左右的经理人，发现他们在职业发展道路上往往有很多致命的问题。在30岁之前，他们的职业生涯表现很优秀，但从30岁到40岁这一段，很多人
  • 【Velocity四】Velocity与Java互操作 bit1129 velocity
    Velocity出现的目的用于简化基于MVC的web应用开发，用于替代JSP标签技术，那么Velocity如何访问Java代码.本篇继续以Velocity三http://bit1129.iteye.com/blog/2106142中的例子为基础，      POJO    package com.tom.servlets; public
  • 【Hive十一】Hive数据倾斜优化 bit1129 hive
    什么是Hive数据倾斜问题   操作：join,group by,count distinct 现象：任务进度长时间维持在99%（或100%），查看任务监控页面，发现只有少量（1个或几个）reduce子任务未完成；查看未完成的子任务，可以看到本地读写数据量积累非常大，通常超过10GB可以认定为发生数据倾斜。 原因：key分布不均匀 倾斜度衡量：平均记录数超过50w且
  • 在nginx中集成lua脚本：添加自定义Http头，封IP等 ronin47 nginx lua csrf
    Lua是一个可以嵌入到Nginx配置文件中的动态脚本语言，从而可以在Nginx请求处理的任何阶段执行各种Lua代码。刚开始我们只是用Lua 把请求路由到后端服务器，但是它对我们架构的作用超出了我们的预期。下面就讲讲我们所做的工作。 强制搜索引擎只索引mixlr.com Google把子域名当作完全独立的网站，我们不希望爬虫抓取子域名的页面，降低我们的Page rank。 location /{
  • java-3.求子数组的最大和 bylijinnan java
    package beautyOfCoding; public class MaxSubArraySum { /** * 3.求子数组的最大和 题目描述： 输入一个整形数组，数组里有正数也有负数。 数组中连续的一个或多个整数组成一个子数组，每个子数组都有一个和。 求所有子数组的和的最大值。要求时间复杂度为O(n)。 例如输入的数组为1, -2, 3, 10, -4,
  • Netty源码学习-FileRegion bylijinnan javanetty
    今天看org.jboss.netty.example.http.file.HttpStaticFileServerHandler.java 可以直接往channel里面写入一个FileRegion对象，而不需要相应的encoder： //pipeline（没有诸如“FileRegionEncoder”的handler）： public ChannelPipeline ge
  • 使用ZeroClipboard解决跨浏览器复制到剪贴板的问题 cngolon 跨浏览器复制到粘贴板Zero Clipboard
    Zero Clipboard的实现原理 Zero Clipboard 利用透明的Flash让其漂浮在复制按钮之上，这样其实点击的不是按钮而是 Flash ，这样将需要的内容传入Flash，再通过Flash的复制功能把传入的内容复制到剪贴板。 Zero Clipboard的安装方法 首先需要下载 Zero Clipboard的压缩包，解压后把文件夹中两个文件：ZeroClipboard.js
  • 单例模式 cuishikuan 单例模式
    第一种（懒汉，线程不安全）： public class Singleton {   2     private static Singleton instance;   3     pri
  • spring+websocket的使用 dalan_123
    一、spring配置文件 <?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.springframework.org/schema/beans"    xmlns:xsi="http://www.w3.or
  • 细节问题：ZEROFILL的用法范围。 dcj3sjt126com mysql
    1、zerofill把月份中的一位数字比如1，2，3等加前导0 mysql> CREATE TABLE t1 (year YEAR(4), month INT(2) UNSIGNED ZEROFILL,    -> day
  • Android开发10——Activity的跳转与传值 dcj3sjt126com Android开发
    Activity跳转与传值，主要是通过Intent类，Intent的作用是激活组件和附带数据。   一、Activity跳转 方法一Intent intent = new Intent(A.this, B.class); startActivity(intent)   方法二Intent intent = new Intent();intent.setCla
  • jdbc 得到表结构、主键 eksliang jdbc 得到表结构、主键
    转自博客：http://blog.csdn.net/ocean1010/article/details/7266042 假设有个con DatabaseMetaData dbmd = con.getMetaData(); rs = dbmd.getColumns(con.getCatalog(), schema, tableName, null); rs.getSt
  • Android 应用程序开关GPS gqdy365 android
    要在应用程序中操作GPS开关需要权限： <uses-permission android:name="android.permission.WRITE_SECURE_SETTINGS" /> 但在配置文件中添加此权限之后会报错，无法再eclipse里面正常编译，怎么办？ 1、方法一：将项目放到Android源码中编译； 2、方法二：网上有人说cl
  • Windows上调试MapReduce zhiquanliu mapreduce
    1.下载hadoop2x-eclipse-plugin https://github.com/winghc/hadoop2x-eclipse-plugin.git 把 hadoop2.6.0-eclipse-plugin.jar 放到eclipse plugin 目录中。 2.下载 hadoop2.6_x64_.zip http://dl.iteye.com/topics/download/d2b
  • 如何看待一些知名博客推广软文的行为？ justjavac 博客
    本文来自我在知乎上的一个回答：http://www.zhihu.com/question/23431810/answer/24588621 互联网上的两种典型心态： 当初求种像条狗，如今撸完嫌人丑 当初搜贴像条犬，如今读完嫌人软 你为啥感觉不舒服呢？ 难道非得要作者把自己的劳动成果免费给你用，你才舒服？ 就如同 Google 关闭了 Gooled Reader，那是
  • sql优化总结 macroli sql
    为了是自己对sql优化有更好的原则性，在这里做一下总结，个人原则如有不对请多多指教。谢谢！   要知道一个简单的sql语句执行效率，就要有查看方式，一遍更好的进行优化。   一、简单的统计语句执行时间 declare @d datetime ---定义一个datetime的变量set @d=getdate() ---获取查询语句开始前的时间select user_id
  • Linux Oracle中常遇到的一些问题及命令总结 超声波 oraclelinux
    1.linux更改主机名   (1)#hostname oracledb　　　　临时修改主机名 (2) vi /etc/sysconfig/network 　　修改hostname (3) vi /etc/hosts　　　　　　　　修改IP对应的主机名   2.linux重启oracle实例及监听的各种方法 （注意操作的顺序应该是先监听，后数据库实例） &nbs
  • hive函数大全及使用示例 superlxw1234 hadoophive函数
      具体说明及示例参 见附件文档。     文档目录：   目录 一、关系运算： 4 1. 等值比较: = 4 2. 不等值比较: <> 4 3. 小于比较: < 4 4. 小于等于比较: <= 4 5. 大于比较: > 5 6. 大于等于比较: >= 5 7. 空值判断: IS NULL 5
  • Spring 4.2新特性-使用@Order调整配置类加载顺序 wiselyman spring 4
    4.1 @Order Spring 4.2 利用@Order控制配置类的加载顺序 4.2 演示 两个演示bean package com.wisely.spring4_2.order; public class Demo1Service { } package com.wisely.spring4_2.order; public class
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他