DOCS: It's not clear where to execute code to register lasso-marko plugin

[timaschew]

Marko Version: 4.12.4

It's not clear where to execute the code snippet to register lasso-marko plugin

Details

See https://github.com/marko-js/marko/blame/168dc9b71e60a442a559faea09f940e00c80fb51/docs/lasso.md#L15-L24

So, it's about this snippet

require('lasso').configure({
    "plugins": [
        ...
        "lasso-marko"
    ]
    ...
});

Expected Behavior

See in which context (which file, like the other snippets) the snippets needs to exist or where to run it from.

Actual Behavior

No context given, just a code snippet.

Possible Fix

Tell the user where to put the snippet

[ianvonholt]

LassoJS is not MarkoJS. The document page is pretty informative with that in mind, has the proper configuration example for LassoJS, and even includes links back to the LassoJS github repo.

Is there something that is not particularly clear?

Deeper dive of what is happening:

To bundle MarkoJS pages together, utilizing LassoJS, you need to include the appropriate Lasso plugins in your package.json and then register them when you configure LassoJS.

Head over to https://github.com/lasso-js/lasso on how to utilize the bundler with a configuration file.

Example:

lasso-configure.js

const isProduction = (process.env.LASSO_ENV && process.env.LASSO_ENV === 'production')
module.exports = {
  'plugins': [
    'lasso-autoprefixer',
    'lasso-marko',
    {
      plugin: 'lasso-stylus',
      config: {
        imports: [
          require.resolve('site/configure/css/vars.styl'),
          require.resolve('site/configure/css/functions.styl')
        ]
      }
    },
    {
      plugin: 'lasso-minify',
      config: {
        babel: {
          enable: true,
          config: {
            extensions: ['.js', '.marko']
          }
        },
        jsMinify: {
          enable: isProduction
        },
        cssMinify: {
          enable: isProduction,
          config: {
            restructure: false
          }
        }
      }
    }
  ],
  'outputDir': 'public/static',
  'fingerprintsEnabled': false,
  'minify': false,
  'resolveCssUrls': isProduction,
  'bundlingEnabled': true,
  'cacheProfile': isProduction ? 'production' : null
}

You'll then need to configure your lasso context in some form as your server starts up:

const lasso = require('lasso')
const lassoConfig = require('./lasso-config')
/*
  * Configure LassoJS
  */
  lasso.configure(lassoConfig)

[timaschew]

It's super clear that lasso is one of many bundlers which you can use for marko. But that's not my point.

My point is exactly the last snippet in your answer.

You'll then need to configure your lasso context in some form as your server starts up:

Exactly that information is missing in the docs. You need to only for server side rendering, right?

But in my case, I don't don't want to do that during server start up time, imagine I don't even start a server, so what do I need to do then? Or if I only want to render it on the client. Or do I need to run the snippet in the client as well? But still what should I do if I want to do the first option, neither server side nor client side rendering, just precompile it. I guess I need to use CLI then?

---

BTW: the API is a bit weird, to have a side effect using lasso.configure, especially if you don't use this object anymore like in the demo app but that's another topic (not my point again).

[DylanPiercey]

Docs/examples have been updated!