Open masariuman opened 4 years ago
i try using this on laravel react-app
first i install it via npm install.
after that i put the plugin config on webpack.mix.js (because laravel using this)
const mix = require("laravel-mix"); const webpack = require("webpack"); mix.react("resources/js/app.js", "public/js") .sass("resources/sass/app.scss", "public/css") .webpackConfig({ plugins: [ new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery" }) ] });
after that i import this on my resource/js/component/new.js like this
import ReactSummernote from "react-summernote"; import "react-summernote/dist/react-summernote.css"; // import styles
i cannot import
import "bootstrap/js/modal"; import "bootstrap/js/dropdown"; import "bootstrap/js/tooltip"; import "bootstrap/dist/css/bootstrap.css";
in apps idk why, i tried npm install bootstrapt and it reinstall the basootstrap. still cannot import, they said when i npm run dev :
Module not found: Error: Can't resolve 'bootstrap/js/dropdown' in '/Users/masariuman/Sites/laravel/noberu/resources/js/components/parent' @ ./resources/js/components/parent/New.js 33:0-31 @ ./resources/js/Index.js @ ./resources/js/app.js @ multi ./resources/js/app.js ./resources/sass/app.scss ERROR in ./resources/js/components/parent/New.js Module not found: Error: Can't resolve 'bootstrap/js/modal' in '/Users/masariuman/Sites/laravel/noberu/resources/js/components/parent' @ ./resources/js/components/parent/New.js 32:0-28 @ ./resources/js/Index.js @ ./resources/js/app.js @ multi ./resources/js/app.js ./resources/sass/app.scss ERROR in ./resources/js/components/parent/New.js Module not found: Error: Can't resolve 'bootstrap/js/tooltip' in '/Users/masariuman/Sites/laravel/noberu/resources/js/components/parent' @ ./resources/js/components/parent/New.js 34:0-30 @ ./resources/js/Index.js @ ./resources/js/app.js @ multi ./resources/js/app.js ./resources/sass/app.scss
so i try not using them, i only using
import ReactSummernote from "react-summernote"; import "react-summernote/dist/react-summernote.css";
and i put it on apps like this
<ReactSummernote options={{ lang: "ru-RU", height: 350, dialogsInBody: true, toolbar: [ ["style", ["style"]], [ "font", [ "bold", "underline", "clear", "strikethrough", "superscript", "subscript", "clear" ] ], [ "fontname", [ "fontname", "fontsize", "color" ] ], [ "para", [ "ul", "ol", "paragraph", "height" ] ], ["table", ["table"]], [ "insert", [ "link", "picture", "video", "hr" ] ], ["view", ["fullscreen", "codeview"]] ] }} onChange={this.handleChangeContent} onImageUpload={this.onImageUpload} />
but the result is i cannot drop down each menu, and the toolbar cannot open too when i click on image or link so i cannot remove link or edit image.
i hope anyone can help me implement it on laravel-react . please.
the problem is i just want dropdown and float toolbar work so i can remove link. please i already search it anywhere and cannot found it.
for full code source on here : https://github.com/masariuman/noberu/blob/master/resources/js/components/parent/New.js
thank you very much
i try using this on laravel react-app
first i install it via npm install.
after that i put the plugin config on webpack.mix.js (because laravel using this)
after that i import this on my resource/js/component/new.js like this
i cannot import
in apps idk why, i tried npm install bootstrapt and it reinstall the basootstrap. still cannot import, they said when i npm run dev :
so i try not using them, i only using
and i put it on apps like this
but the result is i cannot drop down each menu, and the toolbar cannot open too when i click on image or link so i cannot remove link or edit image.
i hope anyone can help me implement it on laravel-react . please.
the problem is i just want dropdown and float toolbar work so i can remove link. please i already search it anywhere and cannot found it.
for full code source on here : https://github.com/masariuman/noberu/blob/master/resources/js/components/parent/New.js
thank you very much