gulpからwebpackに環境を移行した際に、
$ is not defind と出るようになり、どうやらjqueryの読み込みがなく怒られているようです。
そのため、jqueryを読み込むようにすると、サイトが開かず停止してしまいます。

試したことは以下です。
- jqueryをしようしているファイルに import $ from 'jquey'
- webpack.config.jsに plugins:[ new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery' }) ]

ちなみに環境はshopifyで以下の設定です。
webpack.configは一部です。

  • webpack.config.js
    alias: {
      vue$: 'vue/dist/vue.esm.js',
      jquery: path.resolve('./node_modules/jquery'),
      'lodash-es': path.resolve('./node_modules/lodash-es'),
    },
  • .babelrc
{
  "presets": [
    [
      "babel-preset-shopify/web", {
          "modules": false,
        },
      ],
    [
      "@babel/env", {
        "modules": false,
      }
    ]
  ],
  "plugins": ["@babel/transform-async-to-generator"]
}

サイト自体が開かないのでdevtoolで確認することもできず困っています。
なにか分かる方いらっしゃいましたらよろしくお願い致します。