I started plating with tagged template literals on Observable last night and ran into a problem requiring a 3rd party module called “styled-components”.
I used https://observablehq.com/@tmcw/module-require-debugger to find the reference on NPM and added it to a cell, but I still can’t get it to work. I’m not sure where to go from here.
My notebook at https://observablehq.com/@david-hall/tagged-template-literals#help has all of the details about what I’ve tried and a description of the problems I’m seeing. My own tagged template literal code on the page is working fine, but I am having trouble using the 3rd party “styled-components” module. The command…
styled = require('https://email@example.com')
… seems to have loaded OK, but…
Button = styled.button` color: red;`
… is failing with this error message:
Button = TypeError: styled.button is not a function
I don’t think the problem is with the require command, but I’m not sure. Any suggestions?