美文网首页
vue中的imports-loader

vue中的imports-loader

作者: 星球小霸王 | 来源:发表于2017-11-03 15:39 被阅读0次

imports-loader

文档介绍的是:用于向一个模块的作用域内注入变量(Can be used to inject variables into the scope of a module.),官方的文档总是言简意赅但是不太好懂。我们来举个例子。

jqGreen.js文件里仅一行代码

//没有模块化
$('#box').css('color','green');

index.js文件也只有一行代码

require('./jqGreen');

我们的配置文件中,是把index.js作为入口文件的。

{
    entry:{
    index:'./src/js/index.js'
    }
}

注意,我们并没有引入jquery。所以运行的结果是$ is not defined。

但是如果我们稍微修改一下jqGreen的引入方式,就能很轻松的解决这个问题。
index.js文件

require('imports?$=jquery!./jqGreen');

当然,这个能运行之前,我们要npm install imports-loader一下。

上面代码,把变量$注入进模块jqGreen.js。同时,我们指定了变量$=jquery。等于是在jqGreen.js文件的最顶上,加上了var $=require('jquery')。这样,程序就不会报$ is not defined的错误了。

相关文章

网友评论

      本文标题:vue中的imports-loader

      本文链接:https://www.haomeiwen.com/subject/trmtmxtx.html