QmlPragmaLibrary Webpack Plugin

0.0.1 verified Sat Apr 25 auth: no javascript

Webpack plugin that prepends ".pragma library" to JavaScript output files for use as shared JavaScript resources in QML/Qt Quick applications. Current version 0.0.1, single initial release with no defined update cadence. Simple, minimal functionality; no alternatives known.

Common errors

error Error: Cannot find module 'qmlpragmalibrary-webpack-plugin' ↓

cause Package not installed or incorrect require path.

fix

Run npm install qmlpragmalibrary-webpack-plugin --save-dev

error TypeError: QmlPragmaLibraryWebpackPlugin is not a constructor ↓

cause Attempting to use import statement with default import on a CommonJS module.

fix

Use require() instead: const QmlPragmaLibraryWebpackPlugin = require('qmlpragmalibrary-webpack-plugin');

error Module not found: Error: Can't resolve 'qmlpragmalibrary-webpack-plugin' ↓

cause Webpack cannot resolve the plugin package.

fix

Verify that the package is installed and located in node_modules.

Warnings

gotcha The plugin does not support ESM imports (no default export). Use CommonJS require(). ↓

fix Use const QmlPragmaLibraryWebpackPlugin = require('qmlpragmalibrary-webpack-plugin');

gotcha Output files must be named with .qml.js extension to be recognized as QML shared resources? ↓

fix Ensure webpack output filename ends with .qml.js as per Qt conventions.

gotcha Plugin version 0.0.1 is initial release; no breaking changes documented yet. ↓

fix Monitor repository for future breaking changes.

Install

npm install qmlpragmalibrary-webpack-plugin

yarn add qmlpragmalibrary-webpack-plugin

pnpm add qmlpragmalibrary-webpack-plugin

Imports

QmlPragmaLibraryWebpackPlugin

wrong

import QmlPragmaLibraryWebpackPlugin from 'qmlpragmalibrary-webpack-plugin';

correct

const QmlPragmaLibraryWebpackPlugin = require('qmlpragmalibrary-webpack-plugin');

The plugin is CommonJS-only; no ESM or default export.

QmlPragmaLibraryWebpackPlugin

wrong

const { QmlPragmaLibraryWebpackPlugin } = require('qmlpragmalibrary-webpack-plugin');

correct

const { QmlPragmaLibraryWebpackPlugin } = require('qmlpragmalibrary-webpack-plugin');

Named export is not available; the plugin is exported as default via module.exports.

QmlPragmaLibraryWebpackPlugin

wrong

import * as QmlPragmaLibraryWebpackPlugin from 'qmlpragmalibrary-webpack-plugin';

correct

import QmlPragmaLibraryWebpackPlugin = require('qmlpragmalibrary-webpack-plugin');

TypeScript may require 'import = require' syntax due to CommonJS export.

Quickstart

Sets up webpack to prepend .pragma library to the output JavaScript file for QML shared library usage.

const path = require('path');
const QmlPragmaLibraryWebpackPlugin = require('qmlpragmalibrary-webpack-plugin');

module.exports = {
  entry: './src/factorial.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'factorial.qml.js'
  },
  plugins: [
    new QmlPragmaLibraryWebpackPlugin()
  ]
};