2

how can I compile a single marko.js component with webpack or marko-cli, so I can use it as npm module from the npm registry?

The component is working well within my projects as an integrated component, but when I install it as an npm module I get an error like "class { is not allowed" because the component isn't compiled.

Compiling with webpack does not work, it is saying me that it cannot find the marko runtime utilities and the compiled files from marko-cli don't work as components.

Webpack config

const path = require('path')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')

// Get node environment
const { NODE_ENV } = process.env
const isDev = NODE_ENV === 'development'
const env = isDev ? 'development' : 'production'

// Define webpack config
module.exports = {
    mode: env,
    entry: {
        app: ['./client.js'] // I have tried ./component/index.marko also
    },
    output: {
        filename: '[name].js',
        path: path.resolve(__dirname, 'dist')
    },
    resolve: {
        extensions: ['.marko']
    },
    module: {
        rules: [
            {
                test: /\.marko?$/,
                loader: '@marko/webpack/loader'
            },
            {
                test: /\.(sass|scss|css)$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    'css-loader',
                    'sass-loader'
                ]
            },
            {
                test: /\.svg/,
                loader: 'svg-url-loader'
            }
        ]
    },
    plugins: [
        new MiniCssExtractPlugin({
            filename: '[name].css'
        })
    ]
}

Marko component

-- Hello World!

client.js

require('./component/index.marko')
require('marko/components').init()
Teddy95
  • 21
  • 1

0 Answers0