Vue Cli项目引入fomantic-ui-css报jQuery未定义错误如何解决

核心问题：你使用的是Vue CLI脚手架，它有独立的配置加载规则，你自行创建的webpack.config.js不会被脚手架识别加载，因此配置的jQuery全局注入规则未生效，导致Fomantic UI的JS文件加载时找不到jQuery依赖。你已经在package.json中安装了jquery依赖，无需额外安装依赖包。

解决步骤：

• 删除项目中你自行创建的webpack.config.js文件
• 在项目根目录（与package.json同级路径）新建vue.config.js文件，写入以下配置：

const webpack = require('webpack')

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

• 重启本地开发服务，报错即可修复。

*可选方案：如果你项目仅需要使用Fomantic UI的样式，不需要用到它的交互JS组件，可以直接删除main.js中import 'fomantic-ui-css/semantic'这一行，仅保留CSS引入即可，不需要额外配置也不会触发jQuery相关报错。

内容的提问来源于stack exchange，提问作者Rohit