包括模块中的静态资产

Question

我正在尝试(截至目前(最新版本的 vue-cli，但在导入静态资产时遇到了问题。我的设置几乎是一个默认的新项目，只选择了 vuex，我的第一个目标是获得一个运行语义 UI 的无聊模板。这也意味着jQuery的语义UI依赖于它。

为此，我将这个脚本部分添加到主 App.vue

<script>
require('~/jquery/dist/jquery.min.js');
require('./semantic/dist/semantic.js');
</script>

..遵循此处所述的 URL 转换规则。我的(部分(文件夹结构为：

node_modules
jquery
dist
jquery.min.js
src
semantic
dist
semantic.min.js

运行npm run serve确实可以找到语义，但找不到jquery。有人可以告诉我为什么这种包含静态资产的建议方法在这种情况下不起作用吗？

编辑澄清：我的问题明确涉及这种建议的导入方法和 URL 转换规则。对于需要某种方法来使其工作的人，我目前正在将其用作解决方法：

<script>
import jQuery from 'jquery';
window.$ = window.jQuery = jQuery;
require('./semantic/dist/semantic.js');
export default {
}
</script>

Answer 1

如果您使用的是webpack.还有另一种方法可以使用ProvidePlugin将 jQuery 作为全局变量包含在内。您可以添加到您的webpack.base.conf.js

module.exports = {
plugins: [
new webpack.ProvidePlugin({
$: 'jquery',
jquery: 'jquery',
'window.jQuery': 'jquery',
jQuery: 'jquery'
})
]
}

如果您使用的是 Eslint，则需要添加到.eslintrc.js

module.exports = {
globals: {
"$": true,
"jQuery": true
},
...