How to use Uppy with ActiveStorage Discussion
How can I do this in such a way that I don't have to click on the upload button but instead the upload 'box' is shown on the view?
Straight out the box i'm having issues with Uppy. I get the following error index.js:2209 Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'
I have Googled this, and It's to do with the way the the functions in index.js are exported. It's asking that they are exported using export default
rather than module.exports xxx
. Is there any way around this? Obviously, it's not good practice to modify files in node_modules. Thanks
If anyone else gets this error, it's a Babel configuration issue. I ended up using the babel config file from the tutorial.
great episode Chris!
I would like to know who do you manage the external plugins with Companion.
For example: I tried to use the most simple plugin: URL (it doesn't need extra configs)
I created a repo with a simple version of the companion server
https://github.com/psoldier/companion
this is the js in my project:
const companionUrl = 'http://localhost:3020';
uppy.use(Url, { target: Dashboard, companionUrl: companionUrl });
mine: config/initializers/content_security_policy.rb
srcs += ["http://localhost:3020"]
policy.connect_src :self, :https, *srcs
However at this point I'm facing two issues:
1- I cannot send the picture to my s3 bucket (this is something with companion)
2- I don't know what approach handle to connect the that picture with ActiveStorage
Hey Chris - big fan. Set file uploads up in my app using this tutorial and it has been great for a long time but have started having issues with this since upgrading to Rails 7.0.3 - are there any plans to upgrade the library?
The relevant error is:
index.js:11 Uncaught (in promise) TypeError: Class extends value undefined is not a constructor or null
at Object. (index.js:11:52)
Hi,
Im having the same issue as Howard OLeary. Does anyone have a workaround?
I just saw that I wasmissing some updates from the repo. I just ran:
yarn remove @excid3/uppy-activestorage-upload
and then
yarn add https://github.com/excid3/uppy-activestorage-upload
once more. Now it seems to behave nicely again.
I built a stimulus controller for this but ran into some issues getting the uppy stylesheets to load. I spent a lot of time trying to figure it out. Putting details here so I don't lose them or perhaps they can be helpful for somebody else. This solution is using an, as of now, unmerged request to excid3/uppy-activestorage-upload so you may/may not want to use it as a dependency.
Found this video which figures out a working solution using an unmerged pull request from excid3/uppy-activestorage-upload by puglet5/uppy-activestorage-upload.
For me relevant parts are at 1:20:26
uppy_controller.js
let uppy = new Uppy({
autoProceed: false,
allowMultipleUploads: true,
debug: true,
logger: Uppy.debugLogger
})
1:23:21
package.json changed:
"dependencies": {
"@excid3/uppy-activestorage-upload": "https://github.com/excid3/uppy-activestorage-upload.git#08f4a315d252f72e9471ce29d236df7be40de0af",
to:
"@excid3/uppy-activestorage-upload": "https://github.com/puglet5/uppy-activestorage-upload.git#08f4a315d252f72e9471ce29d236df7be40de0af"
then:
yarn install