I am using Rails 6 with webpack. I want to use library jquery-textcomplete
, but I don't know how I must include it to application.js
file.
My steps:
- I've install
jquery-textcomplete
throughyarn add jquery-textcomplete
- I am include this in
application.js
like asimport 'jquery-textcomplete'
orrequire('jquery-textcomplete')
- I see a library in a compiled js file
But I getting an error ncaught TypeError: $(...).textcomplete is not a function
. If I include it through CDN
all work fine.
Can you please tell me, how I must to do? Help me, please.
my webpack/environment.js
const { environment } = require('@rails/webpacker')
const coffee = require('./loaders/coffee')
const webpack = require('webpack')
environment.plugins.prepend('Provide',
new webpack.ProvidePlugin({
$: 'jquery/src/jquery',
jQuery: 'jquery/src/jquery'
})
)
environment.loaders.prepend('coffee', coffee)
module.exports = environment
my application.js
require("@rails/ujs").start();
require("turbolinks").start();
require("@rails/activestorage").start();
require("channels");
require("jquery");
import 'jquery-textcomplete';
my package.json
{
"name": "my_app",
"private": true,
"dependencies": {
"@rails/actioncable": "^6.0.0-alpha",
"@rails/activestorage": "^6.0.0-alpha",
"@rails/ujs": "^6.0.0-alpha",
"@rails/webpacker": "^4.0.7",
"coffee-loader": "^0.9.0",
"coffeescript": "1.12.7",
"jquery": "^3.4.1",
"jquery-textcomplete": "^1.8.5",
"turbolinks": "^5.2.0"
},
"version": "0.1.0",
"devDependencies": {
"webpack-dev-server": "^3.8.1"
}
}