jqueryを読み込むとサイトが開かなくなる
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で確認することもできず困っています。
なにか分かる方いらっしゃいましたらよろしくお願い致します。