包含 jquery 和 bootstrap 时模块解析失败答案

【问题标题】：module parse failed when include jquery and bootsrap包含 jquery 和 bootstrap 时模块解析失败
【发布时间】：2017-01-08 04:43:20
【问题描述】：

我在我的 .vue 文件中添加 SB Admin 模板，

当我在 main.js 中包含 jquery.js 和 bootstrap.js 时，它会返回以下错误：

./~/bootstrap/dist/js/jquery.js 中的错误模块解析失败： E:\swapnil\sanskar\front\node_modules\bootstrap\dist\js\jquery.js 意外令牌 (7586:0) 您可能需要适当的加载程序来处理这种文件类型。 SyntaxError: 意外的令牌 (7586:0) 在 Parser.pp$4.raise (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:2221:15) 在 Parser.pp.unexpected (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:603:10) 在 Parser.pp$3.parseExprAtom (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:1822:12) 在 Parser.pp$3.parseExprSubscripts (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:1715:21) 在 Parser.pp$3.parseMaybeUnary (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:1692:19) 在 Parser.pp$3.parseExprOps (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:1637:21) 在 Parser.pp$3.parseMaybeConditional (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:1620:21) 在 Parser.pp$3.parseMaybeAssign (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:1597:21) 在 Parser.pp$3.parseExpression (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:1573:21) 在 Parser.pp$1.parseStatement (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:727:47) 在 Parser.pp$1.parseBlock (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:981:25) 在 Parser.pp$3.parseFunctionBody (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:2105:24) 在 Parser.pp$1.parseFunction (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:1065:10) 在 Parser.pp$3.parseExprAtom (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:1810:19) 在 Parser.pp$3.parseExprSubscripts (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:1715:21) 在 Parser.pp$3.parseMaybeUnary (E:\swapnil\sanskar\front\node_modules\acorn\dist\acorn.js:1692:19) @ ./src/main.js 19:0-54

我正在使用 jquery 版本：2.1.4 和引导版本：3.3.7，谁能告诉我解决方案？

【问题讨论】：

这一行有什么：./src/main.js 19:0-54
在 webpack.base.conf.js 我有 module.exports = { entry: { app: './src/main.js' }, output: { path: config.build.assetsRoot, publicPath: process.env.NODE_ENV === 'production' ? config.build.assetsPublicPath : config.dev.assetsPublicPath, 文件名: '[name].js' },

标签： jquery vue.js

【解决方案1】：

你可以在 main,js 中使用 ES2015 语法

npm install jquery --save-dev

import $ from 'jquery';
// or
import jQuery from 'jquery';

// export for others scripts to use
window.$ = $;
window.jQuery = jQuery;

同样适用于引导程序或来自 npm 的任何其他依赖项

【讨论】：