Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

vue-script2

Package Overview
Dependencies
Maintainers
1
Versions
12
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

vue-script2

TODO this

  • 1.0.0
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
7.5K
increased by2.89%
Maintainers
1
Weekly downloads
 
Created
Source

vue-script2

Fully restores the <script> tag to front-end single-page-app (SPA) frameworks! This version is for Vue.js, but it's easy to port to Riot.js and others.

It's meant for internal use, not for standalone components that are being shared publicly. Those should be "self-contained" and come with all the JS they need.

Features

  • Just like <script> except with a 2!1
  • Keep your app.js bundle small!
  • Embrace Web Standards™ everyone knows and loves!
  • Easy for web designers to pick up! If you know HTML, you already know how to use it!
  • Tiny! Only 996 bytes! (min+gzip'd)
  • Perfect for use in .ejs templates or .html files!
  • No more including every library on every page!
  • No more complicated "code splitting" nonsense!
  • Ordered execution based on position in markup!
  • Special unload attribute can be used to keep your app's memory usage low!

Installation

npm install vue-script2 --save

Then enable the plugin (in your main.js or wherever):

Vue.use(require('vue-script2'))

Usage

Simple, Traditional, Asynchronous Loading of Scripts

Using vue-script2 with vue-router is simple. Say that only one of your routes displays a "page" that makes use of jQuery. Well, no need to include all of jQuery in your app.js bundle, now you can throw this in:

<script2 src="/path/to/jquery.min.js"></script2>

Boom!

And don't worry, script2 won't double-load a file if it's already loaded!

Delayed Execution of Inlined JavaScript

Want to run some JavaScript only when a certain "page"/route is loaded?

<script2 src="/path/to/jquery.min.js"></script2>
<script2>
// Ordered execution should ensure that '$' is available here
$(document).ready(function () {
    // this code runs *only* when the route
    // that contains this code is loaded! :D->-<
})
</script2>

Cleaning Up Resources On Route Change

The unload attribute accepts JS expressions to run when the component is destroyed. This prevents your SPA from accumulating stuff in memory that's not being used:

<script2 src="/path/to/jquery.min.js" unload="jQuery.noConflict(true)"></script2>

TODO

  • Add tests + Travis CI. Not much to test though. :smile:

License

MIT

1 If you don't like the 2 at the end, feel free to petition your favorite SPA framework to stop breaking the HTML standard! :smile:

FAQs

Package last updated on 07 May 2016

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc