{"id":7070,"date":"2019-05-14T20:29:25","date_gmt":"2019-05-14T20:29:25","guid":{"rendered":"http:\/\/putridparrot.com\/blog\/?p=7070"},"modified":"2019-05-14T20:29:25","modified_gmt":"2019-05-14T20:29:25","slug":"creating-a-sample-javascript-package","status":"publish","type":"post","link":"https:\/\/putridparrot.com\/blog\/creating-a-sample-javascript-package\/","title":{"rendered":"Creating a sample JavaScript package"},"content":{"rendered":"<p>In my previous post I covered some steps to use yalc to create local packages. Let&#8217;s look at creating a very simple package.<\/p>\n<p>We&#8217;ll create a simple little mathematics package which will include functions to <em>add<\/em>, <em>subtract<\/em>, <em>divide<\/em> and <em>multiply<\/em>. <\/p>\n<ul>\n<li>Create a folder for our package, for example Math<\/li>\n<li>Add an index.js file which should look like this\n<pre class=\"brush: java; title: ; notranslate\" title=\"\">\r\n'use strict';\r\n\r\nmodule.exports = {\r\n    add,\r\n    subtract,\r\n    divide,\r\n    multiply\r\n}\r\n\r\nfunction add(a, b) {\r\n    return a + b;\r\n}\r\n\r\nfunction subtract(a, b) {\r\n    return a - b;\r\n}\r\n\r\nfunction divide(a, b) {\r\n    return a \/ b;\r\n}\r\n\r\nfunction multiply(a, b) {\r\n    return a * b;\r\n}\r\n<\/pre>\n<\/li>\n<li>Now, as we&#8217;re going to want to turn this into a package, run\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\r\nyarn init --yes\r\n<\/pre>\n<\/li>\n<li>Edit the package.json file to look like this\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\r\n{\r\n  &quot;name&quot;: &quot;Math&quot;,\r\n  &quot;version&quot;: &quot;1.0.0&quot;,\r\n  &quot;license&quot;: &quot;MIT&quot;,\r\n  &quot;private&quot;: true\r\n}\r\n<\/pre>\n<\/li>\n<\/ul>\n<p>Let&#8217;s look at what we&#8217;ve done, the use of index.js as opposed to say Mathmatics.js is this will then make referencing the file much simpler within the code importing the file, for example we can import like this<\/p>\n<pre class=\"brush: java; title: ; notranslate\" title=\"\">\r\nimport Math from 'Math';\r\n\r\nvar result = Math.add(2, 5);\r\n<\/pre>\n<p>We&#8217;ve used <a href=\"https:\/\/johnresig.com\/blog\/ecmascript-5-strict-mode-json-and-more\/\" rel=\"noopener noreferrer\" target=\"_blank\">strict mode<\/a> to restrict the some JavaScript features but also enhances prevention of silly mistakes.<\/p>\n<p>Next we need to export (at the module level) our functions. In the example we export multiple functions. We could also use the following syntax<\/p>\n<pre class=\"brush: java; title: ; notranslate\" title=\"\">\r\nmodule.exports = {\r\n   add: function(a, b) \r\n   {\r\n      return a + b;\r\n   },\r\n   subtract: function(a, b) \r\n   {\r\n      return a - b;\r\n   }\r\n   \/\/ etc.\r\n}\r\n<\/pre>\n<p>Another alternative syntax is<\/p>\n<pre class=\"brush: java; title: ; notranslate\" title=\"\">\r\nexports.add = function(a, b) {\r\n   return a + b;\r\n}\r\n\r\nexports.subtract = function(a, b) {\r\n   return a - b;\r\n}\r\n\/\/ etc.\r\n<\/pre>\n<p>Now you can package this up using yalc (as per my previous post on yalc).<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In my previous post I covered some steps to use yalc to create local packages. Let&#8217;s look at creating a very simple package. We&#8217;ll create a simple little mathematics package which will include functions to add, subtract, divide and multiply. Create a folder for our package, for example Math Add an index.js file which should [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[45],"tags":[],"class_list":["post-7070","post","type-post","status-publish","format-standard","hentry","category-javascript"],"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/posts\/7070","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/comments?post=7070"}],"version-history":[{"count":3,"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/posts\/7070\/revisions"}],"predecessor-version":[{"id":7073,"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/posts\/7070\/revisions\/7073"}],"wp:attachment":[{"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/media?parent=7070"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/categories?post=7070"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/tags?post=7070"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}