I'm working on my first Meteor app, and I'm trying to escape a string on the server side. I was hoping to use Handlebars.Utils.escapeExpression, but even when I add handlebars (which I had to do, even though Meteor already uses it?), I still get
ReferenceError: Handlebars is not defined
error when that code is hit. Is there a way to invoke that method server side without manually including the source in my project?
Meteor uses Handlebars on the client only. Server-side rendering is on the roadmap.
Also, the Handlebars that comes with Meteor doesn't include Utils.
Use {{{thingThatNeedsEscaping}}} instead, as per the documentation that unescapes it.
Also, I don't think it's necessary to escape stuff before inserting it into the database, if you want it though there are other JS functions for that (like escape variants that are not deprecated).
Related
Let's say I have a file named utils.js, containing two functions s and c.
s is a server-side function (Being called on an /api endpoint handler), and uses mongodb package.
c is a client-side function (will be bundled and sent to the browser).
When compiling the app using next build, will it cause any issues?
Does webpack know to bundle only part of a file/module? (considering server-side functions and imports as a "dead code" since they only being called from a server-side code)
Thanks
If you need to know which functions get bundled to the client & which ones to the server, there's an easy way to know this → https://next-code-elimination.now.sh/
Just copy & paste the contents of your file into it & you'll see which code gets bundled to the client & which code is bundled to the server. If you have imports then make sure to put all the imports in one file so you can see how it works.
The thumb rule is:
Anything like getServerSideProps, getStaticProps & getStaticPaths will be removed from the bundled code. If you import anything from a file that uses server-side code like fs but doesn't use it in any of the above 3 functions, then it won't be removed (check at Next Code Elimination Tool) & will give you an error.
The tool is the answer. I copy-pasted my file in it & found the answer in an instant.
I think there will be errors but not in the build time. It is likely issues will happen in the run time. You won't be able to access file systems on the client side just like how you can't access the window object on the server-side.
In my current project, we have utility functions for both the server-side, client-side, or universal. All server-side functions are called in getServerSideProps to make sure they work as expected. All your server-side code in getServerSideProps will not be imported as part of the client-side bundle if that's what you mean by "dead code". According to the Next.js
Note: You can import modules in top-level scope for use in
getServerSideProps. Imports used in getServerSideProps will not be
bundled for the client-side.
This means you can write server-side code directly in
getServerSideProps. This includes reading from the filesystem or a
database.
I'm not aware of a way you can ask webpack to bundle part of the file or execute a subset of import statements.
I hope that provides some help.
Reference:
Docs - getServerSideProps
Custom Webpack Config
I am having a problem with using jQuery in my Meteor app. It is undefined.
When I look inside .meteor/versions, I can clearly see:
jquery#1.11.3_2
But when I type $ or jQuery in my Chrome console, I get undefined. Also, I cannot use external packages that use any jQuery; I get undefined is not a function exception.
Manually adding jQuery package by meteor add jquery did not solve the issue.
Any idea why this happens?
jQuery is inside the meteor core and defined as a dependency inside meteor-platform. So I never declare it as a a dependency. Meteor relies heavily on it, so it's unlikely to ever be removed. Unlike underscore, which they stated they will remove in a future release. Meteor always aliases $. So that should work. It can't be an issue with that specific version. I'm running the same without any issues. Here are some things you could try to debug:
Create a new project and check if JQ works
Check if an installed package is causing the problem (by removing them one by one)
Packages get loaded before your code, so that can't be the problem.
The docs on docs.meteor.com are very lacking for this check. I've seen elsewhere that it is useful for setting up helper functions in a Handlebars (and the new Spacebars?) JS. But where else would a Meteor.isClient check be required?
It's useful whenever you have shared code between the client and the server. For example, the default code that comes with any new meteor project puts all of the javascript into a single file. Template definitions won't work on the server, so they need to be wrapped within a Meteor.isClient check. Of course in a larger project, you can easily separate these sections into their respective /client and /server directories. However, you could still have utility functions, or methods defined in a shared directory. In those cases you may again find that some portions of the code only make sense when executed in one of the two environments.
TL;DR
They are critical for small apps where all of the code exists in a single file. Larger apps tend to use them only for things like meteor methods which can have a single definition but work differently depending on the environment.
Is there a way in Meteor, to add your own commands to the meteor command for the given project? So that on the server side you could have some commands similar to Django's manage commands. Like command for importing/updating data, maybe cron jobs, things like that? Thing is, I would like commands to have access to all the libraries and environment Meteor provides, especially so that I am sure that data stored in the database is compatible with Meteor.
At the moment this isn't directly possible without an edit of meteor's source. If you're using meteorite you can have a localized meteor version which won't affect the rest of your meteor apps.
You might have to add a custom function over at /tools/meteor.js in this forked/modified meteor.
with:
Commands.push({
name: "yourcustomcommand",
help: "..",
func: function (argv) {
//Custom stuff
});
I am developing a widget, and am using extJS framework (along with stomp,orbited servers). It requires 5 different Javascript files. To avoid impacting load time for users, I am trying to load them asynchronously.
Through some callback stacks, I have managed to asynchronously load them in order they are required.
However, the widget does not work at all in the asynchronous case. I then copied the "modified" resultant HTML DOM from Chrome's developer tools, and created a static HTML file.
The static file works. I am printing few alerts when different JS files are loaded in both cases. The order of these alerts is the same.
How do I detect and fix the error. Stumped after lot of debugging.
(Link removed as they were on production server. Managed to detect the issue and find a workaround - please see answer below - keeping for anyone's reference).
The problem is that Ext.onReady is called as soon as document is ready, which is BEFORE any other scripts are loaded asynchronously.
Thus, the initialization code was not getting called. I manage to work it around by calling Ext.each("dummy args", initialization_function, this) in the last javascript that is loaded. This made things work for me.