@laimoon/js v0.0.2

Laimoon JS

Get Started

1. Install the pacakge via npm:

npm i @laimoon/js --save

2. Install webpack or any bundler you want, I suggest using Laravel Mix since it wraps webpack's complixity and let you focus on work:

npm install cross-env laravel-mix --save-dev
cp node_modules/laravel-mix/setup/webpack.mix.js ./

3. Update your webpack.mix.js to the following:

const mix = require('laravel-mix');
mix.js('src/js/js.js','webroot/js');

4. Create a JS file under src/js/js.js and put the following:

require('@laimoon/js');

5. Add the following scrips into your package.json:

{
  ...
  "scripts": {
    "dev": "npm run development",
    "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "npm run development -- --watch",
    "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
    "prod": "npm run production",
    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  ...
}

6. Compile your JS file js.js for production:

npm run prod

7. Add the generated webroot/js/js.js into your HTML.

8. Once done, you'll have a global object Laimoon you can register more components:

Laimoon.booting((Vue) => {
  //
})

Development

This projects uses webpack with the help of Laravel mix, you can refer to webpack config inside webpack.mix.js for more details.

To rebuild the project during development with watcher:

npm run watch

To rebuild the project with minification for production:

npm run prod

To test your work locally while developing it, you can link the package using npm link:

This step is helpful instead of pushing your developemnt work to npm and then pull it back to any project so that you can save time.

1. In thus repo, run:

npm link

2. In your test projects, use:

npm link laimoon-js

Testing

npm run test