如何将外部js集成到Webpack vue.js中的main.js文件中？

Question

我想集成从源文件夹下载的javascript文件。

考虑路径中存在css和js文件。

从我收集的将CSS集成到main.js我只是添加了

require('./vendor/bootstrap/css/bootstrap.min.css')

但是如何添加一个js文件呢？ 当我以相同方式添加js文件时

require('./vendor/jquery/jquery.min.js')
require('./vendor/bootstrap/js/bootstrap.bundle.min.js')

我收到一条错误消息

./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

Answer 1

将jquery的别名添加到webpack配置（并删除您的require行require('./vendor/jquery/jquery.min.js') ）），因为引导程序依赖于'jquery'模块：

    module.exports = {
    //...
        resolve: {
            alias: {
                jquery: path.resolve(__dirname, 'src/vendor/jquery/jquery.min.js')
            }
        }
    };

该绑定使webpack可以从引导文件中解析require('jquery') 。

如果需要将库映射到$类的其他变量，则必须使用ProvidePlugin ，通过链接检查@ Arseniy-II的注释。