Skip to content

Commit

Permalink
Build with rollup (not cleaned up yet)
Browse files Browse the repository at this point in the history
  • Loading branch information
Marek Dorda committed May 19, 2023
1 parent f1ad0f1 commit eab1bff
Show file tree
Hide file tree
Showing 8 changed files with 528 additions and 1,183 deletions.
30 changes: 11 additions & 19 deletions .eslintrc.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,38 +2,30 @@
"env": {
"es6": true,
"node": true,
"browser": true,
"jest": true
"browser": true
},
"parserOptions": {
"ecmaVersion": 2017,
"ecmaVersion": 2022,
"sourceType": "module"
},
"globals": {
"L": true,
"W": true,
"console": true,
"cordova": true,
"riot": true,
"opts": true,
"d3": true,
"omnivore": true
"console": true
},
"extends": "eslint:recommended",
"rules": {
"indent":"off",
"indent": "off",
"curly": ["error", "all"],
"dot-location": ["error", "property"],
"no-cond-assign":"off",
"no-console":"off",
"no-fallthrough":"off",
"no-mixed-spaces-and-tabs":"off",
"no-cond-assign": "off",
"no-console": "off",
"no-fallthrough": "off",
"no-mixed-spaces-and-tabs": "off",
"no-multi-spaces": "error",
"no-undef-init":"error",
"no-undef":"error",
"no-undef-init": "error",
"no-undef": "error",
"semi": "error"
},
"plugins": [
"html"
]
"plugins": ["html"]
}
210 changes: 86 additions & 124 deletions compiler.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,26 +4,33 @@
* This is plugin building script. Feel free to modify it
* All is MIT licenced
*/
const prog = require('commander');
const { join } = require('path');
const c = require('consola');
const fs = require('fs-extra');
const { yellow, gray } = require('colorette');
const riot = require('riot-compiler');
const assert = require('assert');
const express = require('express');
const app = express();
const less = require('less');
const chokidar = require('chokidar');
const decache = require('decache');
const https = require('https');
const babel = require('@babel/core');

const utils = require('./dev/utils.js');
import fs from 'node:fs';
import path from 'node:path';
import { fileURLToPath } from 'node:url';
import assert from 'node:assert';
import https from 'node:https';

import prog from 'commander';
import prompts from 'prompts';
import ucfirst from 'ucfirst';
import c from 'consola';
import { yellow, gray } from 'colorette';
import express from 'express';
import chokidar from 'chokidar';
import decache from 'decache';

import { builder } from './dev/rollup.js';

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);

const app = express();
const port = 9999;

const { version, name, author, repository, description } = require('./package.json');
// TODO add to plugin
const { version, name, author, repository, description } = JSON.parse(
fs.readFileSync(path.join(__dirname, 'package.json')),
);

prog.option('-b, --build', 'Build the plugin in required directory (default src)')
.option('-w, --watch', 'Build plugin and watch file changes in required directory')
Expand All @@ -40,16 +47,62 @@ if (!process.argv.slice(2).length) {
let config,
srcDir = 'src';

export const prompt = async () => {
let dir = 'src';

const list = fs.readdirSync(path.join(__dirname, 'examples')).filter(d => /\d\d-/.test(d));

console.log(`\nSelect which example you want to test:\n`);

list.map((d, i) =>
console.log(` ${yellow(i + 1)}) ${ucfirst(d.replace(/^\d\d-/, '').replace(/-/g, ' '))}`),
);

console.log(
`\n ${yellow(0)}) F***K OFF with examples. I am pro. I want to develop ${yellow(
'my own plugin',
)}.\n`,
);

let { value } = await prompts({
type: 'number',
name: 'value',
message: `Which example you want to launch? (press 0 - ${list.length}):`,
validate: value => (value >= 0 && value < list.length + 1 ? true : false),
});

if (value > 0) {
dir = path.join('examples', list[value - 1]);
} else if (value === 0) {
console.log(`----------------------------------------------------
Please change ${yellow('package.json')} now:
${yellow('name')}: Must contain name of your plugin in a form windy-plugin-AnyName
${yellow('description')}: Should be description of what your plugin does
${yellow('author')}: Should contain your name
${yellow('repository')}: Should be actual link to your hosting repo
Also ${yellow('./README.md')} should contain some info about your plugin if you wish
For faster work use directlly ${yellow('npm run start-dev')} to skip this prompt
After you will be done use ${yellow('npm publish')} to publish your plugin.
-----------------------------------------------------`);
}

return dir;
};

// Main
(async () => {
console.log(`\nBuilding ${yellow(name)}, version ${yellow(version)}`);

// Beginners example selection
if (prog.prompt) {
srcDir = await utils.prompt();
srcDir = await prompt();
}

c.info(`Compiler will compile ${yellow(`./${srcDir}/plugin.html`)}`);
c.info(`Compiler will compile ${yellow(`./${srcDir}/`)}`);

await reloadConfig();

Expand Down Expand Up @@ -97,8 +150,8 @@ function startServer() {
return new Promise(resolve => {
const httpsOptions = {
// https://www.ibm.com/support/knowledgecenter/en/SSWHYP_4.0.0/com.ibm.apimgmt.cmc.doc/task_apionprem_gernerate_self_signed_openSSL.html
key: fs.readFileSync(join(__dirname, 'dev', 'key.pem'), 'utf8'),
cert: fs.readFileSync(join(__dirname, 'dev', 'certificate.pem'), 'utf8'),
key: fs.readFileSync(path.join(__dirname, 'dev', 'key.pem'), 'utf8'),
cert: fs.readFileSync(path.join(__dirname, 'dev', 'certificate.pem'), 'utf8'),
};

app.use(express.static('dist'));
Expand All @@ -123,121 +176,30 @@ function startServer() {
*/
async function build() {
// Riot parser options
const riotOpts = {
entities: true,
compact: false,
expr: true,
type: null,
template: null,
fileConfig: null,
concat: false,
modular: false,
debug: true,
const destination = path.join(__dirname, 'dist');
const meta = {
name,
version,
author,
repository,
description,
...config,
};

// Compile less - feel free to code your SCSS here
let css = await compileLess();

// Load source code of a plugin
const tagSrc = await fs.readFile(join(srcDir, 'plugin.html'), 'utf8');

// Compile it via riot compiler
// See: https://github.com/riot/compiler
const [compiled] = riot.compile(tagSrc, riotOpts);
let { html, js, imports } = compiled;

const options = Object.assign(
{},
{
name,
version,
author,
repository,
description,
},
config,
);

const internalModules = {};

//
// Rewrite imports into W.require
//
if (imports) {
let match;
const importsRegEx = /import\s+(?:\*\s+as\s+)?(\{[^}]+\}|\S+)\s+from\s+['"](@windy\/)?(plugins\/)?([^'"']+)['"]/gm;
while ((match = importsRegEx.exec(imports)) !== null) {
let [, lex, isCore, isPlugin, module] = match;
// detect syntax "import graph from './soundingGraph.mjs'"
// and loads external module
if (!isCore) {
module = await utils.externalMjs(srcDir, internalModules, module, name);
}
js = `\tconst ${lex} = W.require('${(isPlugin ? '@plugins/' : '') + module}');\n${js}`;
}
}

// Stringify output
let output = utils.stringifyPlugin(options, html, css, js);

// Add external modules
for (let ext in internalModules) {
output += `\n\n${internalModules[ext]}`;
}

// Save plugin to dest directory
const destination = join(__dirname, 'dist', 'plugin.js');

// Babel traspile
if (prog.transpile) {
c.info('Transpiling with babel');
let res = await babel.transformAsync(output, {
presets: ['@babel/preset-env'],
}); // => Promise<{ code, map, ast }>
output = res.code;
}
const { code } = await builder(name, srcDir, meta);

await fs.outputFile(destination, output);
fs.writeFileSync(path.join(destination, 'plugin.js'), code);

c.success(`Your plugin ${gray(name)} has been compiled to ${gray(destination)}`);
}

//
// L E S S compiler
//
async function compileLess() {
const lessOptions = {
cleancss: true,
compress: true,
};

const lessFile = join(srcDir, 'plugin.less');

if (!fs.existsSync(lessFile)) {
return null;
}

const lessSrc = await fs.readFile(lessFile, 'utf8');

let { css } = await less.render(lessSrc, lessOptions);

return css;
}

//
// Reload config
//
async function reloadConfig() {
const dir = join(__dirname, srcDir, 'config.js');
const { default: dir } = await import(path.join(__dirname, srcDir, 'config.js'));
decache(dir);
config = require(dir);
config = dir;
return;
}

//
// Watch change of file
//
const onChange = async fullPath => {
c.info(`watch: File changed ${gray(fullPath)}`);

Expand Down
Loading

0 comments on commit eab1bff

Please sign in to comment.