I am already using highlighterjs and would rather use the externally included highlighter(js and css) and build a version of remarkjs that is much smaller. I can't figure out how to accomplish this. The included make.js file is supposed to build the highlighter only if the highlighter target is explicitly specified, but seems to automatically include it even if not specified. Suggestions?
See https://github.com/gnab/remark/wiki/Contributing#building for instructions on how to build remarkjs without the highlighting library, and still use it with an externally included library for highlighting code.
Related
I am using Bootstrap, but would like to reduce the size of the Javascript.
I only need dropdown/collapse and sometimes carousel, so I want to include only those.
There is a folder "dist" with every single script individually.
I tried including them via -SCRIPT- tag. It does not work at all and produces lots of errors in the console.
Do I need specific other script files too, or is the JS in the dist-folder just not suitable for that?
Please forgive me, I have very little knowledge about JS and english is not my first language.
Simply put, how do I include only the needed JS into Bootstrap5?
I am on Windows and do NOT have NPM or any other bundler/packager/installer.
I am surprised, there is no dedicated website for configuring the JS.
I googled a lot but did not find anything related to my question.
First call basic utilities then call individual components [bootstrap 5.2.3]
My first observation is that you may be heading down the premature optimisation path. The difference between the minimal bootstrap build, and the individual components isn't huge. And on top of this, the main advantage of using a CDN is that the browser will likely have already loaded and cached it (from use in another site: it's a common resource) so trying to do anything non-standard will increase load-times, not reduce them.
But if you're set on using the individual components, they are available on the CDN too, as described on the bootstrap site.
Make sure to use the integrity and crossorigin attributes to protect your site from leaking information to the CDN, and also being attacked via the CDN. If you're new to this, have a read of this page on subresource integrity.
Use Bootstrap Cdn
You can simply use this link
<script src="https://cdn.jsdelivr.net/npm/bootstrap#5.1.3/dist/js/bootstrap.bundle.min.js"></script>
Now u dont need to include from folder
I am finding a frustrating issue with JavaScript intellisense where if I include jQuery UI in my _references.js file I lose all JavaScript intellisense. Does anyone know if there is a way to fix this problem beyond removing jQuery UI from the _references.js?
Update
I do know that more files in the _references.js file will cause it to slow down, that makes sense. However, I have projects at work which include far more files (on the order of 600) with no typesense issues, and my project has 20. So it's not a matter of "too many files."
I pulled my project from Git to a separate computer (therefore separate installation of VS15) and tried including the jQuery UI file and this still caused the loss of intellisense in my project.
It can't be an installation issue since other work projects include jQuery UI and there are no intellisense issues
I do realize that I can manually manage _references.js to accomplish the task, but I would like to fix it altogether since I hate needing to add information twice (create the JS file and then update _refernces.js).
With this new information, I'm thinking it must be some type of deeper issue in my project's setup that is causing the issue as opposed to an installation based issue or jQuery UI specific issue. Does anyone have any ideas on what settings in a .sln or .csproj file might cause JS Intellisense issues?
For those who experience this issue, I found that using jQuery 3.x was causing instellisense to break when jQuery UI was included in _references.js. My solution was using NuGet to change back to version 2.2.4 and everything started to work fine again.
I've got the same problem. I tried quite a few things but the only thing I could get to consistently work was to disable the auto sync feature and remove the jquery UI reference.
Intellisense also seems to slow down a good bit with more and more libraries, almost to the point it looks like it is not working.
I finally just got to the point where I only include my own scripts and jquery for helpful reminders on syntax.
Unfortunately this means I have to manually keep the _references.js file up to date but it's definitely better than it not working at all.
You can also limit your global references in the _references file and drag the script files that you want intellisense for to each view if you are like me where you have a script file for each view. That way you don't get intellisense for scripts that aren't even rendered to the view.
not sure if this will help you but have you added this to the top of your .js file?
/// <reference path="/scripts/jquery-3.1.1.js" />
that's the path that's made if you you've used NuGet to install jquery for your solution. If you've located your jquery file and intellisense file elsewhere use that path instead (I do believe they need to be in the same folder).
I found a better solution! Simple rename jquery-ui-1.12.1.js (or similar) to _jquery-ui-1.12.1.js. This will cause it to appear at the top BEFORE the conflicting jQuery 3 references in the _references.js file that cause intellisense to not work. Be sure to also update any script tag or BundleConfig.cs references you have to include the new underscore character prefix!
Solution:
In your _references.js file:
Move the JQuery-UI reference above the main JQuery reference
Disable auto-sync
such as:
/// <autosync enabled="false" />
/// <reference path="jquery-ui-1.12.1.js" />
/// <reference path="jquery-3.3.1.js" />
Drawbacks:
You will have to repeat step 1 every time you Update JavaScript References (right-click on _references.js to update references in Visual Studio).
Always install jQuery first any version you like and then install JQuery-ui. If you want
to upgrade or degrade version of JQuery, you have to uninstall and again install JQuery-ui every time you do changes. First Jquery-3.6.0.js then Jquery-ui-1.12.1.js and you have to reinstall jquery-ui every time you make changes in jquery.
I have Javascript libraries downloaded in different folders, how do I set the path for them to be picked up by sublime. (and hopefully also show autocomplete for them)
I believe the right way to get the library into a js file is this:
var highcharts = require('highcharts');
Neither does it pick up the library nor does it do any autocomplete.
I've had problems with Emmet (same as the one mentioned here https://github.com/sergeche/emmet-sublime/issues/129) so I have the following plugins installed:
Javascript Next
Javascript Completions
SublimeCodeintel
SublimeLinter-jshint
For the autocompletions I've already asked a question (https://stackoverflow.com/questions/29079474/get-autocomplete-for-new-javascript-libraties-in-sublime) but the problem I want to get solved here is getting the library recognized and thereby suggest autocomplete.
Thanks.
Try All Autocomplete plugin, it finds matches in all open files of the current window.
I have a website built on the MEAN.io stack and am trying to generate PDF files on the client side with pdfmake. One can install pdfmake with bower (it looks like they used browserify to generate the client-side version).
I am struggling to get it to work. Either the injection of pdfmake does not work (I assume it cannot be found) or the pdfmake object is undefined (if I don't add pdfmake as a dependancy). I assume pdfmake needs to be packaged in some way to make it accessible, but I don't know how.
In config/assets.json I added:
"bower_components/pdfmake/build/pdfmake.js"
In the HTML corresponding to the JS file in which I want to use pdfmake I added:
<script src="bower_components/pdfmake/build/pdfmake.js"></script>
<script src="bower_components/pdfmake/build/vfs_fonts.js"></script>
I have set up a basic version on Github. I would really appreciate it if someone could explain to me how to make it possible to make pdfmake available for use in packages/system/public/controllers/index.js, for example.
I was recently have a similar problem. It seems to come from the fact that pdfmake isn't yet "browserfiable." After much troubleshooting, I was able to get it working through simply including the two client-side scripts pdfmake.min.js and vfs_fonts.js via script tags in my build directory. That's it.
Try moving the two script tags out of the bower_components directory and into your build directory. Make sure they're before your bundle.js, or generally whatever scripts need pdfmake.
I don't fully understand how bundled scripts are able to see the global objects created by these two files, but I think it's because they're setting pdfMake to the window object:
(The vfs_fonts.js file starts like this:)
window.pdfMake = window.pdfMake || {}; window.pdfMake.vfs
Since Browserify sets the global object to window, this approach seems to work. (Though I don't fully understand why... see this Github issue on their repo for more explanation and the deglobalify npm package.)
Here's another relevant post I was able to find.
My problem is short and simple. I've got the basic example set up as described by the Ext JS team (http://docs.sencha.com/extjs/4.1.3/#!/guide/application_architecture) but currently it only works with ext-debug.js.
I'd like to use the ext.js-core itself, but that doesn't allow me to use dynamic loading, thus forces me to use ext-all.js, which is a huge honking script of which 80% I don't need (abstractables and extended classes not included).
It is possible to write my Ext.Application in ext-debug.js for development and then switch live to ext.js?
/edit
I found this wonderful documentation, which doesn't explain why a minified version of ext-debug (thus ext.js) doesn't work, but there you go.
ext-debug.js - This file is only for use during development. It provides the minimum number of core Ext JS classes needed to get up and running. Any additional classes should be dynamically loaded as separate files as demonstrated above.
ext.js - same as ext-debug.js but minified for use in production. Meant to be used in combination with your application's app-all.js file. (see section 3)
ext-all-debug.js - This file contains the entire Ext JS library. This can be helpful for shortening your initial learning curve, however ext-debug.js is preferred in most cases for actual application development.
ext-all.js - This is a minified version of ext-all-debug.js that can be used in production environments, however, it is not recommended since most applications will not make use of all the classes that it contains. Instead it is recommended that you create a custom build for your production environment as described in section 3.
The key is here:
Meant to be used in combination with your application's app-all.js file
Your application(and all the dependencies) should be compiled into single file app-all.js (you can do it with help of the sencha sdk). Your html should look like the following:
<script type="text/javascript" src="path/to/extjs/ext.js"></script>
<script type="text/javascript" src="path/to/app-all.js"></script>
I'd like to use the ext.js-core itself, but that doesn't allow me to use dynamic loading
There shouldn't be any dynamic loading as all the javascript is compiled into those two files (ext.js and app-all.js).
Use ext-dev.js instead of ext-debug.js to get dynamic loading and comments. Use Sencha Cmd to build the production JavaScript and CSS files.