@timmclaughlin absolutely we want webpack to work for development. It’s something we’ve been trying to polish, but there are a few rough edges.
Having said that, it shouldn’t be rebuilding absolutely everything (although it will refresh the page) when running in watch mode. It will however need to re-evaluate the server bundle (assuming you are using the @marko/webpack plugin).
We haven’t yet explored adding hot reloading on the webpack side of things, but perhaps that could help there.
webpack --watch --progressWe have a single entrypoint for the server side of the app called
index.js. After the initial build, whenever I edit a file and observe the output I can see webpack rebuilding and re-emitting every file again. What's more s that all of the marko files on both the server and client are marked [not cacheable].
webpack --profile --json > compilation-stats.json and looking under the modules section in the generated output I could see that it was only .marko files that are marked as uncacheable. The component.jsfiles appear to be cacheable. Here's one of the module outputshttps://gist.github.com/Khauri/d2f775f82618f2f6ca0c46fa4f3e609b
class or component.js file. If you don’t use class or component.js then viritually no JS is sent to the browser. There is also component-browser.js which gives you a subset of the Marko lifecycle (we call this a split component). Essentially it allows you to use onMount and allows you to attach event handlers. It does not give you access to this.state which means the component cannot re-render, and so the template itself is not bundled for the browser.
Also, good morning everyone!
Many of you already know that we've been looking to expand the Marko team for a while now. We're excited to announce that @ryansolid will be joining us in a couple of weeks to help us take Marko into the future! He's written an article to announce this move that is definitely worth the read https://dev.to/ryansolid/i-m-joining-the-markojs-core-team-2fc1 :tada:
<script src="https://cdn.jsdelivr.net/npm/socket.io-client@2/dist/socket.io.js"></script>
<script>
$(document).ready(function() {
const socket = io('https://mywebsite.com:5000');
socket.on('new_photo', data => {
console.log(data);
//Marko state updates
state.imagea = data.url;
});
});
</script>
Hi There,
I am new to markojs and having an issue where images on background-image are not display.
For example:
<div style="background-image: url('./bg1.jpeg');">
test
</div>
However this tag is working:
<img src="./bg1.jpeg"/>
Can anyone point me to what I need to do to get this working.
Much appreciated
@daohientang we're not actively monitoring this channel, please join us on discord: https://discord.gg/marko
Having said that for your issue, the problem is that we actually special case the img src attribute. When you start having raw strings like background images it requires a bit more of a verbose api which would be specific to your bundler. For webpack it'd look like:
import bgURL from "./bg1.png";
<div style=`background-image: url(${bgURL});`>
test
</div>
component.input = props
component.update()