[英]How to integrate a external js into the main.js file in Webpack vue.js?
I want to integrate a downloaded javascript file from the source folder. 我想集成从源文件夹下载的javascript文件。
Consider that the css and js files exists in the path. 考虑路径中存在css和js文件。
From what I gather to integrate a css in the main.js
I just add 从我收集的将CSS集成到main.js
我只是添加了
require('./vendor/bootstrap/css/bootstrap.min.css')
but how to add a js file ? 但是如何添加一个js文件呢? When I add the js files the same way 当我以相同方式添加js文件时
require('./vendor/jquery/jquery.min.js')
require('./vendor/bootstrap/js/bootstrap.bundle.min.js')
I get an error message 我收到一条错误消息
./src/vendor/bootstrap/js/bootstrap.bundle.min.js
Module not found: Error: Can't resolve 'jquery' in '/home/<cool path>/ClientVueJs/src/vendor/bootstrap/js'
@ ./src/vendor/bootstrap/js/bootstrap.bundle.min.js 14:125-142
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js
Add alias for jquery to webpack config(and remove your require
line require('./vendor/jquery/jquery.min.js')
), because bootstrap depends on 'jquery' module: 将jquery的别名添加到webpack配置(并删除您的require
行require('./vendor/jquery/jquery.min.js')
)),因为引导程序依赖于'jquery'模块:
module.exports = {
//...
resolve: {
alias: {
jquery: path.resolve(__dirname, 'src/vendor/jquery/jquery.min.js')
}
}
};
This binding lets webpack resolve require('jquery')
from bootstrap file. 该绑定使webpack可以从引导文件中解析require('jquery')
。
If you need to map library to additional variables like $
you have to use ProvidePlugin
, check @Arseniy-II's comment with link. 如果需要将库映射到$
类的其他变量,则必须使用ProvidePlugin
,通过链接检查@ Arseniy-II的注释。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.