You have to set jQuery dependency for your custom script. You have
occurance of problem because of dependency issue.
- For Module/Extension Level
You can set at module/extension level dependency like below,
app/code/Packagename/Modulename/view/frontend/requirejs-config.js
var config = {
paths: {
'slider': "Packagename_Modulename/js/slider"
},
shim: {
'slider': {
deps: ['jquery']
}
}
};
Add slider.js inside path, app/code/Packagename/Modulename/view/frontend/web/js/slider.js
You can use in any template file like this,
<script>
require(["jquery","slider"],function($)(){
$(document).ready(function() {
$(element).slider({
//option
});
});
});
</script>
- Theme Level
If you want to apply require js changes at theme level,
Go to theme module,
app/design/frontend/{Packagename}/{themename}/Packagename_Modulename/requirejs-config.js
Set your theme required js file in requirejs-config.js
var config = {
paths: {
'slider': "Packagename_Modulename/js/slider",
'customjsfile': "Packagename_Modulename/js/customjsfile",
},
shim: {
'slider': {
deps: ['jquery']
},
'customjsfile':{
deps: ['jquery']
}
}
};
Add your js file inside web folder of theme,
app/design/frontend/{Packagename}/{themename}/Packagename_Modulename/web/js/slider.js
app/design/frontend/{Packagename}/{themename}/Packagename_Modulename/web/js/customjsfile.js
In your template file,
<script>
require(["jquery","slider","customjsfile"],function($)(){
$(document).ready(function() {
$(element).slider({
//option
});
});
});
</script>
For your case,
Keep below config in requirejs-config.js file,
var config = {
paths: {
'footerContact': 'Module_Contact/js/contact'
},
shim: {
'footerContact': {
deps: ['jquery']
}
}
};
Inside phtml file,
<script>
require(["jquery","footerContact"],function($)(){
jquery('.element').on('click', function(event) {
console.log('logging');
});
});
</script>
Best Answer
Create requirejs-config.js Companyname\Modulename\view\frontend\requirejs-config.js add
Your Js file in your module Companyname\Modulename\view\frontend\web\js\flexslider.js
You just add jquery lib using following syntax
second example