Do you have any suggestions for how to work with BSS on a big project? Let's assume I have a ruby-on-rails project with a bit of reactjs. I think it does not make any sense to import the whole thing into BSS, because it doesn't understand all the ERB in the HTML, it guess it would just result in a big bunch of custom code... and I'm also not sure how BSS can handle rails' project structure with the asset pipeline and such.
But maybe the other way 'round - I believe BSS might be pretty useful for building the reactjs templates. They're small UI components, each could come with its own css, so my plan is...
- one BSS project for my RoR project
- one page for each reactjs component
- I can also include react expressions in BSS
- at the end I export from BSS and move the files into the RoR project
However the last step seems to be a lot of work when the number of react components grows. I mean I don't want to just build the initial design in BSS and only export it once. I want to be able to update reactjs components in BSS and export them again and again. So the export-and-move-into-the-ruby-on-rails-project-structure step should be optimized... but how? Putting more stuff into less files in BSS? Writing a sync script? Configuring RoR/ReactJS to look for all components in one directory only? Writing a sync script?
to answer your question simply you won't be able to use react with this app over and over.
If you do a search you will find this has come up a few times as has angular, but the only way for you to include react/angular/vue etc is to do so post export.
I hope at some point that the devs allow us to include the tags needed to support this as would be great additional functionality but right now believe the focus is get BS4 implemented
I've given it a try ...and actually it seems to work with react-template pretty well. So here's what I do:
- I build 1 html page for 1 react component in BSS (including react-template stuff as custom code)
- I export it with a custom export script, which basically does 3 things:
- extract the contents of <body>
- remove the <script> tags at the end
- call rt on the resulting file (rt) so that it produces a js file (.rt.js) with the react objects
- currently I just dismiss the other exported stuff (assets folder), but I'm pretty sure that this can also be integrated in the export script if necessary
Now I can use the BSS export as a react object in the render function (that's how react-templates work generally). Well, actually I use it in coffeescript since I haven't migrated to ES6, yet. It didn't work right away, because the asset pipeline of rails (I think sprockets in particular) works alphabetically, thus it included the react components (.js) 1st and the rt react objects (.rt.js) 2nd, so they were undefined when being called. But I could fix that issue by exporting the .rt files in a different folder (that also contains the .rt.js files after rt has been called) than the react components. That way I can call require_tree on the .rt.js folder before require_tree on my react components to have them in the correct order.
So to sum it up: I stumbled over a lot of small issues and I was in doubt if the rt script would pass through rt attributes and rt html elements, because I saw a lot of "unkown element" errors when I was building the export script, but in the end everything seems to work just fine.