1.require

1.1完整路径的require语句:

require('tools'); //preset alias tools
require('./js/main');

1.2带表达式的 require 语句:自动创建一个上下文(context)

如果你的 require参数含有表达式(expressions),会自动创建一个上下文(context),因为在编译时(compile time)并不清楚具体是哪一个模块被导入。

如:

require('./template/' + name + '.ejs');

webpack 解析 require() 的调用,提取出来如下这些信息:

Directory: ./template
Regular expression: /^.*\.ejs$/

会返回template目录下的所有后缀为.ejs模块的引用,包含子目录:

{
"./table.ejs": 42,
"./table-row.ejs": 43,
"./directory/folder.ejs": 44
}

2.require.context:手动创建一个上下文(context)

require.context(directory, useSubdirectories = false, regExp = /^\.\//);
directory:指定要打包的目录;
useSubdirectories :是否搜寻子目录;
regExp :匹配的正则

例:
require.context("./test", false, /\.test\.js$/);
//(创建了)一个包含了 test 文件夹(不包含子目录)下面的、所有文件名以 `.test.js` 结尾的、能被 require 请求到的文件的上下文。

详情参照官网:https://webpack.docschina.org/guides/dependency-management/#带表达式的-require-语句
												

[Vue]webpack的require与require.context的更多相关文章

  1. 一字一句的搞懂vue-cli之vue webpack template配置

    webpack--神一样的存在.无论写了多少次,再次相见,仍是初见.有的时候开发vue项目,对尤大的vue-cli感激涕零.但是,但是,但是...不是自己的东西,真的很不想折腾.所以,我们就得深入内部 ...

  2. 【原创】从零开始搭建Electron+Vue+Webpack项目框架,一套代码,同时构建客户端、web端(二)

    摘要:上篇文章说到了如何新建工程,并启动一个最简单的Electron应用.“跑起来”了Electron,那就接着把Vue“跑起来”吧.有一点需要说明的是,webpack是贯穿这个系列始终的,我也是本着 ...

  3. Vue + Webpack + Vue-loader 系列教程(1)功能介绍篇

    原文地址:https://lvyongbo.gitbooks.io/vue-loader/content/ Vue-loader 是什么? vue-loader 是一个加载器,能把如下格式的 Vue ...

  4. Vue + Webpack + Vue-loader 1

    Vue + Webpack + Vue-loader 原文地址:https://lvyongbo.gitbooks.io/vue-loader/content/ Vue-loader 是什么? vue ...

  5. 从零开始:一个正式的vue+webpack项目的目录结构是怎么形成的

    如何从零开始一个vue+webpack前端工程工作流的搭建,首先我们先从项目的目录结构入手.一个持续可发展,不断加入新功能,方便后期维护的目录结构究竟是长什么样子的?接下来闰土大叔带你们一起手摸手学起 ...

  6. Vue + webpack 项目实践

    Vue.js 是一款极简的 mvvm 框架,如果让我用一个词来形容它,就是 “轻·巧” .如果用一句话来描述它,它能够集众多优秀逐流的前端框架之大成,但同时保持简单易用.废话不多说,来看几个例子: & ...

  7. nodejs, vue, webpack 项目实践

    vue 及 webpack,均不需要与nodejs一期使用,他们都可以单独使用到任何语言的框架中. http://jiongks.name/blog/just-vue/ https://cn.vuej ...

  8. 从0开始搭建vue+webpack脚手架(三)

    在从0开始搭建vue+webpack脚手架(二)中已经基本完成了开发环境的配置.当开发完成后,我们需要将完成的项目进行打包,接下来对打包做一些优化: 运行 $ npm run build 可生成dis ...

  9. 从0开始搭建vue+webpack脚手架(二)

    接着从0开始搭建vue+webpack脚手架(一) 三.配置webpack-dev-server 1. webpack-dev-server自带一个node的服务器, 项目在服务端运行的同时可以实现热 ...

  10. vue+webpack开发(一)

    一开始接触这个vue+webpack的时候,实在是摸不着头脑,根本无从下手. 但是经过这两天的研究,其实你会发现vue其实并不难,难度都在webpack你对webpack的理解. webpack顾名思 ...

随机推荐

  1. mysql构建一张百万级别数据的表信息测试

    表信息: CREATE TABLE dept( /*部门表*/ deptno MEDIUMINT UNSIGNED NOT NULL DEFAULT 0, /*编号*/ dname VARCHAR(2 ...

  2. 使用python下载一些链接的软件包

    import reimport requestsimport osimport wget get = raw_input("please input your link::")pa ...

  3. (转)CentOs7.3 搭建 RabbitMQ 3.6 Cluster 集群服务与使用

    RabbitMQ是一个开源的AMQP实现,服务器端用Erlang语言编写,支持多种客户端,如:Python.Ruby..NET.Java.JMS.C.PHP.ActionScript.XMPP.STO ...

  4. MapReduce Unit Test

    以前用java写MR程序总不习惯写单元测试,就是查错也只是在小规模数据上跑一下程序.昨天工作时,遇到一个bug,查了好久也查出来.估计是业务逻辑上的错误.后来没办法,只好写了个单元测试,一步步跟踪,瞬 ...

  5. mysql 提示符显示用户,数据库等信息

    命令: mysql -uroot -p --prompt="\\u@\\h:\\d \\r:\\m:\\s>" 效果: root@localhost:(mysql) 02:2 ...

  6. H5移动端的一些坑、、、

    H5项目常见问题及注意事项 Meta基础知识: H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 //一.HTML页面结构 <meta name="viewport" co ...

  7. Django-RestFrameWork之分页 视图 路由 渲染器

    目录 一.分页 二.视图 三.路由 四.渲染器 一.分页 试问如果当数据量特别大的时候,你是怎么解决分页的? 方式a.记录当前访问页数的数据id 方式b.最多显示120页等 方式c.只显示上一页,下一 ...

  8. HomeBrew的安装详细步骤

    1)终端输入:/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master ...

  9. Multiple encodings set for module chunk explatform "GBK" will be used by compiler

    项目用idea启动的时候,突然报了个这个 Multiple encodings set for module explatform "GBK" will be used by co ...

  10. $digest / $apply digest in progress报错

    有的时候出于某种原因,如jq操作了model.或者$watch.setTimeout等函数改变了model,导致最后没有脏数据检测.所以我没就手动调用了$apply( )等.但是第一次运行的时候ang ...