猿始森林
猿始森林

vue-cli2构建多页面：改造原配置文件，实现自动构建多页面入口和模板文件

一、改造utils.js，添加getModules方法，方法中需要使用到node的glob模块

1、安装glob模块

npm i glob -D

2、创建getModules方法，获取文件名以及对应路径

const glob = require('glob');

// 构建多页面（获取文件名以及对应路径）
exports.getModules = function (globPath) {
  let modules = {}
  // 读取src目录,并进行路径裁剪
  glob.sync(globPath).forEach(function (url) {
    const ext = path.extname(url);  // 获取文件后缀
    const moduleName = path.basename(url, ext); // 获取文件名
    modules[moduleName] = url
  });
  return modules;
}

.

二、改造webpack.base.conf.js，修改入口文件配置

  • 我们只需要有一个入口文件，这样就减少了维护的成本。那么，因为在入口文件里面需要引入对应的.vue文件，就需要import from后面接入一个变量，但是这是不被import from支持的；
  • 所以，博主就使用了下面的方式来自动生成入口文件，以避免手动维护：

1、修改如下：

entry: Object.assign(getEntries(), {
    app: './src/main.js'
}),

const fs = require('fs')

// 处理入口文件
function getEntries(){
  const entries = {};
  // 生成入口文件
  const pages = utils.getModules('./src/pages/**/*.vue');
  for(let pageCode in pages) {
    const entryFile = `./entry/${pageCode}.js`;
    fs.exists(entryFile, function (exists) {	  // 这里没有对文件目录进行判断，所以需要先建一个'entry'文件夹，否则会报错
      if (exists) return;
      const appTpl = '.' + pages[pageCode];
      const entryData = ` import Vue from 'vue';\n import App from '${appTpl}';\n Vue.config.productionTip = false;\n new Vue({ el: '#${pageCode}', components: { App }, template: '' }); `;
      fs.writeFile(entryFile, entryData, function (err) {
        if (err) console.log(err);
      });
    });
    // 获取入口文件数据
    entries[pageCode] = entryFile;
  }
  return entries;
}

2、生成的入口文件（entry/index.js）

 import Vue from 'vue';
 import App from '../src/pages/index/index.vue';
 Vue.config.productionTip = false;
 new Vue({ el: '#index', components: { App }, template: '' });

.

三、改造webpack.dev.conf.js和webpack.prod.conf.js

1、删除原有的页面配置new HtmlWebpackPlugin()

// webpack.dev.conf.js

// 构建多页面（删除之前的页面配置）
// new HtmlWebpackPlugin({
//   filename: 'index.html',
//   template: 'index.html',
//   inject: true
// }),
// copy custom static assets

// webpack.prod.conf.js

// 构建多页面（删除之前的页面配置）
// new HtmlWebpackPlugin({
//   filename: process.env.NODE_ENV === 'testing'
//     ? 'index.html'
//     : config.build.index,
//   template: 'index.html',
//   inject: true,
//   minify: {
//     removeComments: true,
//     collapseWhitespace: true,
//     removeAttributeQuotes: true
//     // more options:
//     // https://github.com/kangax/html-minifier#options-quick-reference
//   },
//   // necessary to consistently work with multiple chunks via CommonsChunkPlugin
//   chunksSortMode: 'dependency'
// }),

2、增加多页面配置

  • 当然，你可以分别在这两个文件里面进行配置，以细分开发环境和生产环境的配置；
  • 这里，我就直接在webpack.base.conf.js里面进行配置了。

.

四、继续改造webpack.base.conf.js，添加模板配置new HtmlWebpackPlugin()

1、webpack.base.conf.js增加代码如下：

const HtmlWebpackPlugin = require('html-webpack-plugin')

// 构建多页面
const pagesJson = require('../config/page.json');
const pages = utils.getModules('./src/pages/**/*.vue');

for(let pageCode in pages) {
  // 自定义页面数据
  const pageData = pagesJson[pageCode] || {};
  Object.assign(pageData, {
    url: pages[pageCode],
    code: pageCode
  });
  // 配置生成的html文件
  const conf = {
    filename: pageCode + '.html',
    template: './index.html', // 模板路径
    favicon: './favicon.ico',
    inject: true,
    chunks: ['manifest', 'vendor', 'app', pageCode],   // 引入资源文件
    chunksSortMode: 'manual',       // 控制 chunk 的排序。none | auto（默认）| dependency（依赖）| manual（手动）| {function}
    pageData: pageData
  };
  if(!baseWebpackConfig.plugins) baseWebpackConfig.plugins = [];
  baseWebpackConfig.plugins.push(new HtmlWebpackPlugin(conf));
}

2、模板文件（index.html）

<% 
    const page = htmlWebpackPlugin.options.pageData || { title:'vue cli2' }; 
%>


<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><%= page.title %>title>
head>

<body>
    <div id="app">
        <div id="<%= page.code %>">div>
    div>
    
body>

html>

3、页面参数配置文件（config/page.json）

{
    "index": {
        "title": "首页"
    },
    "shop": {
        "title": "商店"
    },
    "shopDetail": {
        "title": "商店详情"
    }
}

.

五、页面文件结构，如下：

vue-cli2构建多页面：改造原配置文件，实现自动构建多页面入口和模板文件_第1张图片

  • 如此，我们就只完成了模板文件和入口文件的自动化构建，现在我们就只需要新增src/pages/*.vue来创建页面了

.

六、项目地址（记得给星哦）

https://github.com/shiguang0116/vue-cli2-multipage

.

七、相关文章

vue-cli3构建多页面：提取通用模板和入口文件，自动构建多页配置

你可能感兴趣的:(Vue)

  • SpringBoot + vue 管理系统 m0_74825565 面试学习路线阿里巴巴springbootvue.js后端
    SpringBoot+vue管理系统文章目录SpringBoot+vue管理系统1、成品效果展示2、项目准备3、项目开发3.1、部门管理3.1.1、前端核心代码3.1.2、后端代码实现3.2、员工管理3.2.1、前端核心代码3.2.2、后端代码实现3.3、班级管理3.3.1、前端核心代码3.3.2、后端代码实现3.4、学生管理3.4.1、前端核心代码3.4.2、后端代码实现3.5、数据统计3.5.
  • React vs Vue3深度对比与使用场景分析 匹马夕阳 VUE技术集锦react.js前端前端框架
    在前端开发领域，React和Vue3是两个备受瞩目的框架。它们都提供了强大的功能和灵活的开发方式，但各自的设计理念、使用方式和适用场景有所不同。本文将深入探讨React和Vue3的区别，通过代码示例和具体的使用场景，帮助开发者更好地理解并选择适合自己的框架。一、核心概念与设计理念1.ReactReact是由Facebook开发的一个JavaScript库，主要用于构建用户界面。它的核心理念是组件化
  • compare-form.vue 的 v 来源（来自父组件index.vue中的row行数据） 小丁学Java 产品资质管理系统ubuntulinux运维
    文章目录`compare-form.vue`的父组件`compare-form.vue`的`v`来源相关代码片段1.`value`的Prop定义2.`@Watch('value')`及其`watchValue`方法3.与`value`间接相关的代码（影响`v`的初始化或使用）总结子组件compare-form.vue父组件index.vue以下是关于compare-form.vue和其父组件src
  • 点击修改按钮图片显示有问题 小丁学Java 产品资质管理系统vue
    问题可能出在表单数据的初始化上。在ave-form.vue中，我们需要处理一下从后端返回的图片数据，因为它们可能是JSON字符串格式。vue:src/views/tools/fake-strategy/components/ave-form.vue//...existingcode...@Watch('value')watchValue(v:any){this.$nextTick(()=>{thi
  • Vue的测试策略：如何使用单元测试和端对端测试来确保Vue应用的质量 哎 你看 vuevue.js单元测试前端
    介绍测试的重要性在开发软件应用的过程中，测试具有重要的作用。它可以帮助开发者捕捉到程序中的错误和漏洞，保证软件的质量。功能性的测试可以帮助确认应用程序或系统满足了其功能需求。测试驱动的开发方式，如TDD（Test-DrivenDevelopment），也被广泛提倡并实践，因为它可以在早期发现并解决问题，提升开发效率。在持续集成和持续发布（CI/CD）的工作流中，自动化测试是保证代码质量的关键，它帮
  • Vue的单元测试和端到端测试：确保组件可靠性与应用完整性 哎 你看 vuevue.js单元测试前端
    引言在软件开发过程中，测试是保证代码质量和应用稳定性的关键环节。Vue.js作为流行的前端框架，提供了一套完善的测试工具和生态系统，支持开发者进行单元测试和端到端测试。本文将深入探讨如何为Vue组件编写单元测试，并讨论如何使用Cypress等工具进行端到端测试。单元测试1.单元测试的概念单元测试是针对程序中最小的可测试单元进行检查和验证的过程，通常关注函数或方法级别的测试。2.Vue组件的单元测试
  • 深入浅出 Pinia：下一代 Vue 状态管理库的核心实践与设计哲学 斯~内克 vue知识点vue.js前端javascript
    引言：为什么需要状态管理？在现代前端开发中，随着应用复杂度提升，组件间的数据共享和状态管理成为关键挑战。传统的组件间通信（如props/emit）在跨层级组件或大型应用中显得力不从心，而Vue生态早期的Vuex虽然解决了这一问题，但随着TypeScript的普及和CompositionAPI的推出，开发者对状态管理工具提出了更高要求——这便是Pinia诞生的背景。第一部分：Pinia基础概念1.1
  • vue监听中的watch监听(详解) 皓月当空hy vuevue.js
    1、watch选项用于监听数据的变化并执行相应的回调函数。watch选项提供了两个重要的属性：deep和immediate。1.1、深度监听(deep:true)当你需要监听一个对象或数组内部的变化时，可以使用deep:true。这会使得watch监听器递归地监听对象或数组内部的所有嵌套属性的变化。//示例：watch:{  myObject:{   handler(newVal,oldVal){
  • Vue.js 组件化开发：从入门到进阶 小李学软件 vue学习前端框架vue.js前端javascript前端框架
    Vue.js组件化开发：从入门到进阶大家好，今天我们来聊一聊Vue.js的“组件化开发”。目前Vue开发已经相对成熟了，相信很多朋友对组件化开发并不陌生。如果你对组件化开发已经非常熟悉，看到我的文章，欢迎点个支持一下。如果你是刚入门，我强烈建议学习一下哦。如果你想巩固Vue组件化的知识，非常推荐来学习。一、什么是组件化开发？在进入正题之前，想问大家一个问题：你有没有拼过乐高？如果有的话，你就会知道
  • Vue.js组件开发：从基础到进阶 码上飞扬 vue.js
    在现代前端开发中，Vue.js因其简洁、灵活和易上手的特点，成为了众多开发者首选的框架之一。组件化是Vue.js的核心思想之一，它让我们能够更高效、模块化地开发应用。在本文中，我们将从Vue.js的组件开发的基础知识开始，逐步探索如何通过Vue.js进行高效的组件化开发。一、Vue.js组件的基础Vue.js中的组件可以理解为一个具有特定功能的代码块，它通常包含视图（HTML）、样式（CSS）和逻
  • vue3中测试：单元测试、组件测试、端到端测试 皓月当空hy vue.js
    1、单元测试：单元测试通常适用于独立的业务逻辑、组件、类、模块或函数，不涉及UI渲染、网络请求或其他环境问题。describe('increment',()=>{//测试用例})toBe()：用于严格相等比较（===），适用于原始类型或检查引用类型是否指向同一个对象。toEqual()：用于深度比较，检查两个对象或数组的内容是否相等（即使它们不是同一个对象）。例如：test('increments
  • 现代前端框架渲染机制深度解析：虚拟DOM到编译时优化 桂月二二 前端框架
    引言：前端框架的性能进化论TikTokWeb将React18迁移至Vue3后，点击响应延迟降低42%，内存占用减少35%。Shopify采用Svelte重构核心交互模块，首帧渲染速度提升580%。Discord在Next.js14中启用ReactServerComponents后，服务端数据吞吐量增加240%，客户端Bundle体积减少54%。一、主流框架技术架构差异1.1三大范式运行机制对比维度
  • 基于SpringBoot+Vue驾校理论课模拟考试系统源码(自动化部署) .whl Java学习进阶毕设源码springbootvue.js自动化
    DrivingTestSimulationUnity3DProject,subjecttwo,simulateddrivingtest【更新信息】更新时间-2021-1-17解决了方向盘不同机型转动轴心偏离更新时间-2021-2-18加入了手刹系统待更新-2021-6-19（工作太忙少有时间更新，先指出问题）解决了在REC回放下偶然出现的物体回放错位BUG（每一个挂ReplayEntity.cs的
  • Vue.js 深入解析：从基础到进阶 sleepwalking450 vue.js前端javascript
    Vue.js是一个渐进式JavaScript框架，专注于构建用户界面，尤其是单页面应用（SPA）。它的设计理念强调“渐进式框架”，即你可以从最基本的功能开始，逐步引入更多的功能以应对复杂的应用需求。Vue.js既可以作为一个简单的UI渲染引擎，也可以通过VueRouter和Vuex扩展为强大的全栈开发工具。本篇文章将对Vue.js的核心特性进行更加细致的分析，帮助你从基本的入门知识到更加复杂的高级
  • Vue.js 入门指南：从基础到实战 阿绵 前端vue.js前端javascript
    Vue.js是一款流行的渐进式JavaScript框架，广泛用于构建交互式Web界面。它具有简单易学、轻量级、高性能的特点，适合前端新手入门。本文将从Vue的基本概念入手，详细介绍Vue的生命周期及常见用法，帮助你快速上手Vue开发官网：https://cn.vuejs.org/1.Vue.js介绍1.1Vue的特点易学易用：Vue采用直观的模板语法，降低了学习成本响应式数据绑定：使用双向绑定(v
  • 深入浅出 Vue.js：从基础到进阶的全面总结 多年以后_ vue.js前端javascript
    深入浅出Vue.js：从基础到进阶的全面总结Vue.js是一个用于构建用户界面的渐进式框架。它不仅易于上手，还能通过其强大的生态系统支持复杂的应用开发。本文将从基础到进阶，全面总结Vue.js的核心概念、常用技术和最佳实践，并提供代码示例以便更好地理解。目录Vue.js基础Vue实例模板语法计算属性和侦听器组件系统组件基础父子组件通信插槽VueRouter路由基础动态路由匹配嵌套路由Vuex状态管
  • vue3中子组件调用父组件事件 小华0000 vue.jsjavascript前端
    在Vue3中，子组件调用父组件的事件（或方法）的方式与Vue2类似，但Vue3引入了CompositionAPI，这可能会改变你组织代码的方式。不过，基本的通信机制——通过自定义事件($emit)通知父组件——仍然保持不变。以下是如何在Vue3中使用OptionsAPI和CompositionAPI的示例：使用OptionsAPI父组件(ParentComponent.vue)父组件importC
  • fastapi 大型应用_FastApi项目实战 - 爱投票管理系统（一） 赌徒梦 fastapi大型应用
    一、闲来无事，在工作之余自己研究了一下python的异步框架-fastapi，并写包括1、部门管理2、角色管理3、用户管理4、菜单管理5、登录日志6、操作日志7、添加反爬机制六个基础功能模块，演示链接：https://www.lovevote.cn，账号：admin，密码：admin由于我的电脑问题，下载的vue依赖包有几个发生了版本冲突，打包部署后偶尔会在点击菜单按钮时发生前端延时(这时表现为缓
  • springboot + vue 前后端完全分离的博客项目 明日再死 SpringBootvue.jsspringbootrestful
    文章目录前言一、运行截图二、前后台功能前端构架后端架构运行截图总结源码地址前言学完了springboot后，又花了十一天学完了禹神的vue2.x与3.x，一直想找机会练习一下vue来制作单页面前端程序，正巧，B站上看了一位叫markerhub的up主发了这个项目，于是我看了看源码，做了一些改进（源码学习，并非白嫖谢谢）一、运行截图登录界面注册界面找回密码界面二、前后台功能前端构架vue2.xvue
  • Vue3 动态创建组件实现数据绑定（h函数） CrxzYia 前端前端javascriptvue.js
    经常看到框架里使用h函数动态创建组件，可自己使用时发现数据无法绑定，我使用的代码如下{span:6,label:"区",path:"groupId",component:h(NSelect,{options:groupIdOptions.value,value:modalRef.value.groupId,"onUpdate:value":(value:string)=>modalRef.valu
  • TypeScript 中的 type 和 interface：你真的了解它们的不同吗？ 初见雨夜 前端typescriptjavascript前端
    如果你有写过Vue3的项目，那么对TypeScript肯定不会陌生。不管是公司新项目技术选型还是个人学习开发新的前端项目，Vue3+TypeScript已经成为首选技术方案之一在TypeScript这个强大的静态类型系统中，type和interface是两个重要的关键字，用于定义和描述数据类型。然而，这两者之间的区别是什么，在实际开发过程中我们要怎么用呢？废话不说，直接进入正题，就让我们一起深入探
  • vite+vue+ts+element-plus从零开发管理后台框架(04)-整体布局 vue3
    布局参考文档，整体使用上、左、右的布局。编辑src/views/Main.vue，内容如下。HeaderAsideMain.el-header{background-color:red;}.el-aside{background-color:green;}.el-main{background-color:blue;}浏览器访问http://localhost:5173/#/，会发现高度没有铺满。
  • vite+vue+ts+element-plus从零开发管理后台框架(05)-菜单和路由 vue3
    视图新建src/views/Home.vue，内容如下。首页新建src/views/sys/AdmUserPassword.vue，内容如下。密码更新新建src/views/sys/AdmUser.vue，内容如下。管理员新建src/views/log/AdmUserLogin.vue，内容如下。管理员登录日志路由配置编辑src/router/index.ts，修改Main路由如下。{path:'
  • Vue中如何轻松实现可调整大小的容器布局——vue-resizeable组件教程
    介绍vue-resizeable是一款在vue项目中可调整各个区域大小的组件，支持任意组合，支持自定义样式演示体验地址https://liquanquan.top/vue-admin/resizablenpm地址https://www.npmjs.com/package/vue-resizeablegithubhttps://github.com/taoman/vue-resizeable欢迎各位
  • avue富文本编辑器如何保证上传图片正常 R-sz java前端javascript
    {label:"内容",prop:"content",component:'AvueUeditor',action:"/api/blade-resource/oss/endpoint/put-file",propsHttp:{res:"data",url:"link",},hide:true,viewDisplay:false,minRows:6,span:24,rules:[{required:
  • uniapp-首页模块 Brilliant Nemo uniappuni-appjavascript前端
    小兔鲜儿-首页模块涉及知识点：组件通信、组件自动导入、数据渲染、触底分页加载、下拉刷新等。自定义导航栏参考效果：自定义导航栏的样式需要适配不同的机型。:::tip操作步骤准备组件静态结构修改页面配置，隐藏默认导航栏，修改文字颜色样式适配->安全区域:::静态结构新建业务组件：src/pages/index/componets/CustomNavbar.vue<scriptsetuplang
  • Vue.js 详细介绍 DOMINICHZL vue.jsvue.js
    1.引言在前端开发领域，Vue.js无疑是一个备受瞩目的框架。它以其轻量、易用和高效的特点，迅速成为开发者们的首选。无论你是前端新手，还是有一定经验的开发者，Vue.js都能为你提供强大的支持。本文将带你从零开始，深入了解Vue.js的核心概念、使用方法以及最佳实践。2.Vue.js简介2.1什么是Vue.js？Vue.js是一套用于构建用户界面的渐进式JavaScript框架。与其他大型框架不同
  • Vue学习教程-16html标签元素绑定事件 番茄番茄君 vue.js学习前端
    文章目录前言一、表单数据绑定事件二、多媒体元素绑定1.图片img和视频元素video三、容器元素绑定事件前言在Vue中，你可以通过v-on指令（或在Vue2.x中简写为@）来绑定事件。这种方式允许你监听DOM事件，并在触发时执行一些JavaScript代码。常见的元素主要是表单数据元素、多媒体元素和容器元素。一、表单数据绑定事件常见的表单数据元素1.文本输入框元素3.多选框元素4.下拉框元素5.按
  • React面试（一） 束尘 vue.jsjavascript前端react.js
    文章目录1.vue和react有什么异同2.useEffect中为什么不能使用异步3.useEffect和useLayoutEffect的区别4.react的生命周期5.state和prop的区别6.受控组件和非受控组件7.为什么react16之后不把事件挂载到document上了8.讲一下react的hoc，它可以用来做什么？9.讲一下对reactfiber的理解10.讲一下react.comp
  • 2025届毕业设计选题参考，包含网站管理系统开发，微信小程序开发，APP开发，大数据分析，人工智能 平姐设计 计算机毕业设计选题清单微信小程序开发语言人工智能数据分析
    网站开发选题：1、基于Java的企业食堂管理系统的设计与实现2、基于web的办公平台3、综合学工服务系统4、超市管理系统5、基于springboot的云笔记共享系统6、毕业生实习管理系统7、驾校预约管理系统8、基于Java的航空订票系统9、企业资源规划系统10、洗衣房预约管理系统的设计与实现11、桌面端有声小说12、基于Python的毕业生就业率分析管理系统的设计与实现13、基于VUE的富平县农产
  • Java开发中，spring mvc 的线程怎么调用？ 小麦麦子 springmvc
    今天逛知乎，看到最近很多人都在问spring mvc 的线程http://www.maiziedu.com/course/java/ 的启动问题，觉得挺有意思的，那哥们儿问的也听仔细，下面的回答也很详尽，分享出来，希望遇对遇到类似问题的Java开发程序猿有所帮助。 问题：     在用spring mvc架构的网站上，设一线程在虚拟机启动时运行，线程里有一全局
  • maven依赖范围 bitcarter maven
    1.test 测试的时候才会依赖，编译和打包不依赖，如junit不被打包 2.compile 只有编译和打包时才会依赖 3.provided 编译和测试的时候依赖，打包不依赖，如：tomcat的一些公用jar包 4.runtime 运行时依赖，编译不依赖 5.默认compile 依赖范围compile是支持传递的，test不支持传递 1.传递的意思是项目A，引用
  • Jaxb org.xml.sax.saxparseexception : premature end of file darrenzhu xmlprematureJAXB
    如果在使用JAXB把xml文件unmarshal成vo(XSD自动生成的vo)时碰到如下错误： org.xml.sax.saxparseexception : premature end of file 很有可能时你直接读取文件为inputstream，然后将inputstream作为构建unmarshal需要的source参数。InputSource inputSource = new In
  • CSS Specificity 周凡杨 html权重Specificitycss
      有时候对于页面元素设置了样式，可为什么页面的显示没有匹配上呢？ because specificity CSS 的选择符是有权重的，当不同的选择符的样式设置有冲突时，浏览器会采用权重高的选择符设置的样式。     规则：   HTML标签的权重是1 Class 的权重是10 Id 的权重是100
  • java与servlet g21121 servlet
    servlet 搞java web开发的人一定不会陌生，而且大家还会时常用到它。 下面是java官方网站上对servlet的介绍： java官网对于servlet的解释 写道 Java Servlet Technology Overview Servlets are the Java platform technology of choice for extending and enha
  • eclipse中安装maven插件 510888780 eclipsemaven
    1.首先去官网下载 Maven： http://www.apache.org/dyn/closer.cgi/maven/binaries/apache-maven-3.2.3-bin.tar.gz 下载完成之后将其解压， 我将解压后的文件夹：apache-maven-3.2.3， 并将它放在 D:\tools目录下， 即 maven 最终的路径是：D:\tools\apache-mave
  • jpa@OneToOne关联关系 布衣凌宇 jpa
    Nruser里的pruserid关联到Pruser的主键id，实现对一个表的增删改，另一个表的数据随之增删改。 Nruser实体类 //***************************************************************** @Entity @Table(name="nruser") @DynamicInsert @Dynam
  • 我的spring学习笔记11-Spring中关于声明式事务的配置 aijuans spring事务配置
    这两天学到事务管理这一块，结合到之前的terasoluna框架，觉得书本上讲的还是简单阿。我就把我从书本上学到的再结合实际的项目以及网上看到的一些内容，对声明式事务管理做个整理吧。我看得Spring in Action第二版中只提到了用TransactionProxyFactoryBean和<tx:advice/>,定义注释驱动这三种，我承认后两种的内容很好，很强大。但是实际的项目当中
  • java 动态代理简单实现 antlove javahandlerproxydynamicservice
    dynamicproxy.service.HelloService package dynamicproxy.service; public interface HelloService { public void sayHello(); }   dynamicproxy.service.impl.HelloServiceImpl package dynamicp
  • JDBC连接数据库 百合不是茶 JDBC编程JAVA操作oracle数据库
             如果我们要想连接oracle公司的数据库，就要首先下载oralce公司的驱动程序，将这个驱动程序的jar包导入到我们工程中;   JDBC链接数据库的代码和固定写法;     1,加载oracle数据库的驱动;     &nb
  • 单例模式中的多线程分析 bijian1013 javathread多线程java多线程
    谈到单例模式，我们立马会想到饿汉式和懒汉式加载，所谓饿汉式就是在创建类时就创建好了实例，懒汉式在获取实例时才去创建实例，即延迟加载。 饿汉式： package com.bijian.study; public class Singleton { private Singleton() { } // 注意这是private 只供内部调用 private static
  • javascript读取和修改原型特别需要注意原型的读写不具有对等性 bijian1013 JavaScriptprototype
            对于从原型对象继承而来的成员，其读和写具有内在的不对等性。比如有一个对象A，假设它的原型对象是B，B的原型对象是null。如果我们需要读取A对象的name属性值，那么JS会优先在A中查找，如果找到了name属性那么就返回；如果A中没有name属性，那么就到原型B中查找name，如果找到了就返回；如果原型B中也没有
  • 【持久化框架MyBatis3六】MyBatis3集成第三方DataSource bit1129 dataSource
    MyBatis内置了数据源的支持，如：   <environments default="development"> <environment id="development"> <transactionManager type="JDBC" /> <data
  • 我程序中用到的urldecode和base64decode,MD5 bitcarter cMD5base64decodeurldecode
    这里是base64decode和urldecode，Md5在附件中。因为我是在后台所以需要解码： string Base64Decode(const char* Data,int DataByte,int& OutByte) { //解码表 const char DecodeTable[] = { 0, 0, 0, 0, 0, 0
  • 腾讯资深运维专家周小军：QQ与微信架构的惊天秘密 ronin47
    社交领域一直是互联网创业的大热门，从PC到移动端，从OICQ、MSN到QQ。到了移动互联网时代，社交领域应用开始彻底爆发，直奔黄金期。腾讯在过去几年里，社交平台更是火到爆，QQ和微信坐拥几亿的粉丝，QQ空间和朋友圈各种刷屏，写心得，晒照片，秀视频，那么谁来为企鹅保驾护航呢？支撑QQ和微信海量数据背后的架构又有哪些惊天内幕呢？本期大讲堂的内容来自今年2月份ChinaUnix对腾讯社交网络运营服务中心
  • java-69-旋转数组的最小元素。把一个数组最开始的若干个元素搬到数组的末尾，我们称之为数组的旋转。输入一个排好序的数组的一个旋转，输出旋转数组的最小元素 bylijinnan java
    public class MinOfShiftedArray { /** * Q69 旋转数组的最小元素 * 把一个数组最开始的若干个元素搬到数组的末尾，我们称之为数组的旋转。输入一个排好序的数组的一个旋转，输出旋转数组的最小元素。 * 例如数组{3, 4, 5, 1, 2}为{1, 2, 3, 4, 5}的一个旋转，该数组的最小值为1。 */ publ
  • 看博客，应该是有方向的 Cb123456 反省看博客
    看博客，应该是有方向的:  我现在就复习以前的，在补补以前不会的，现在还不会的，同时完善完善项目，也看看别人的博客.  我刚突然想到的:  1.应该看计算机组成原理，数据结构，一些算法，还有关于android,java的。  2.对于我，也快大四了，看一些职业规划的，以及一些学习的经验，看看别人的工作总结的.    为什么要写
  • [开源与商业]做开源项目的人生活上一定要朴素,尽量减少对官方和商业体系的依赖 comsci 开源项目
         为什么这样说呢？  因为科学和技术的发展有时候需要一个平缓和长期的积累过程，但是行政和商业体系本身充满各种不稳定性和不确定性，如果你希望长期从事某个科研项目，但是却又必须依赖于某种行政和商业体系，那其中的过程必定充满各种风险。。。       所以，为避免这种不确定性风险，我
  • 一个 sql优化 （[精华] 一个查询优化的分析调整全过程！很值得一看 ） cwqcwqmax9 sql
    见   http://www.itpub.net/forum.php?mod=viewthread&tid=239011 Web翻页优化实例 提交时间: 2004-6-18 15:37:49      回复    发消息  环境： Linux ve
  • Hibernat and Ibatis dashuaifu Hibernateibatis
    Hibernate  VS  iBATIS 简介 Hibernate 是当前最流行的O/R mapping框架，当前版本是3.05。它出身于sf.net，现在已经成为Jboss的一部分了 iBATIS 是另外一种优秀的O/R mapping框架，当前版本是2.0。目前属于apache的一个子项目了。 相对Hibernate“O/R”而言，iBATIS 是一种“Sql Mappi
  • 备份MYSQL脚本 dcj3sjt126com mysql
    #!/bin/sh # this shell to backup mysql #[email protected] (QQ:1413161683 DuChengJiu) _dbDir=/var/lib/mysql/ _today=`date +%w` _bakDir=/usr/backup/$_today [ ! -d $_bakDir ] && mkdir -p
  • iOS第三方开源库的吐槽和备忘 dcj3sjt126com ios
    转自 ibireme的博客   做iOS开发总会接触到一些第三方库，这里整理一下，做一些吐槽。   目前比较活跃的社区仍旧是Github，除此以外也有一些不错的库散落在Google Code、SourceForge等地方。由于Github社区太过主流，这里主要介绍一下Github里面流行的iOS库。   首先整理了一份 Github上排名靠
  • html wlwmanifest.xml eoems htmlxml
    所谓优化wp_head()就是把从wp_head中移除不需要元素，同时也可以加快速度。 步骤： 加入到function.php remove_action('wp_head', 'wp_generator'); //wp-generator移除wordpress的版本号，本身blog的版本号没什么意义，但是如果让恶意玩家看到，可能会用官网公布的漏洞攻击blog remov
  • 浅谈Java定时器发展 hacksin java并发timer定时器
    java在jdk1.3中推出了定时器类Timer,而后在jdk1.5后由Dou Lea从新开发出了支持多线程的ScheduleThreadPoolExecutor，从后者的表现来看，可以考虑完全替代Timer了。 Timer与ScheduleThreadPoolExecutor对比： 1.    Timer始于jdk1.3,其原理是利用一个TimerTask数组当作队列
  • 移动端页面侧边导航滑入效果 ini jqueryWebhtml5cssjavascirpt
    效果体验：http://hovertree.com/texiao/mobile/2.htm可以使用移动设备浏览器查看效果。效果使用到jquery-2.1.4.min.js，该版本的jQuery库是用于支持HTML5的浏览器上，不再兼容IE8以前的浏览器，现在移动端浏览器一般都支持HTML5，所以使用该jQuery没问题。HTML文件代码： <!DOCTYPE html> <h
  • AspectJ+Javasist记录日志 kane_xie aspectjjavasist
    在项目中碰到这样一个需求，对一个服务类的每一个方法，在方法开始和结束的时候分别记录一条日志，内容包括方法名，参数名+参数值以及方法执行的时间。   @Override public String get(String key) { // long start = System.currentTimeMillis(); // System.out.println("Be
  • redis学习笔记 MJC410621 redisNoSQL
    1)nosql数据库主要由以下特点：非关系型的、分布式的、开源的、水平可扩展的。 1，处理超大量的数据 2，运行在便宜的PC服务器集群上， 3，击碎了性能瓶颈。 1)对数据高并发读写。 2)对海量数据的高效率存储和访问。 3)对数据的高扩展性和高可用性。 redis支持的类型： Sring 类型 set name lijie get name lijie set na
  • 使用redis实现分布式锁 qifeifei
    在多节点的系统中，如何实现分布式锁机制，其中用redis来实现是很好的方法之一，我们先来看一下jedis包中，有个类名BinaryJedis,它有个方法如下：   public Long setnx(final byte[] key, final byte[] value) { checkIsInMulti(); client.setnx(key, value); ret
  • BI并非万能，中层业务管理报表要另辟蹊径 张老师的菜 大数据BI商业智能信息化
           BI是商业智能的缩写，是可以帮助企业做出明智的业务经营决策的工具，其数据来源于各个业务系统，如ERP、CRM、SCM、进销存、HER、OA等。        BI系统不同于传统的管理信息系统，他号称是一个整体应用的解决方案，是融入管理思想的强大系统：有着系统整体的设计思想，支持对所有
  • 安装rvm后出现rvm not a function 或者ruby -v后提示没安装ruby的问题 wudixiaotie function
    1.在~/.bashrc最后加入 [[ -s "$HOME/.rvm/scripts/rvm" ]] && source "$HOME/.rvm/scripts/rvm"  2.重新启动terminal输入：   rvm use ruby-2.2.1 --default  把当前安装的ruby版本设为默
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他