lincd-cli 0.1.11 → 0.1.12

package/defaults/app3/frontend/src/Layout.tsx

@@ -0,0 +1,11 @@
+import React from 'react';
+import {Header} from './Header';
+
+export default function Layout({children}) {
+  return (
+    <main className="m-8 font-sans">
+      <Header />
+      {children}
+    </main>
+  );
+}

package/defaults/app3/frontend/src/_tailwind.scss

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

package/defaults/app3/frontend/src/components/Spinner.scss

@@ -0,0 +1,17 @@
+
+.spinner.spinner--active {
+  border: 4px solid #474545;
+  border-top: 4px solid lightblue;
+  border-radius: 50%;
+  width: 24px;
+  height: 24px;
+  animation: spin 1s linear infinite;
+}
+@keyframes spin {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}

package/defaults/app3/frontend/src/components/Spinner.tsx

@@ -0,0 +1,10 @@
+import './Spinner.scss';
+export default function Spinner({active = true}) {
+  return (
+    <div
+      className={['spinner', active && 'spinner--active'].join(' ')}
+      role="progressbar"
+      aria-busy={active ? 'true' : 'false'}
+    />
+  );
+}

package/defaults/app3/frontend/src/index.tsx

@@ -0,0 +1,20 @@
+window['$RefreshReg$'] = () => {};
+window['$RefreshSig$'] = () => () => {};
+
+import {hydrateRoot} from 'react-dom/client';
+import {BrowserRouter} from 'react-router-dom';
+import App from './App';
+import React from 'react';
+
+//comment out if you don't want to use tailwind
+import './_tailwind.scss';
+
+
+hydrateRoot(
+  document,
+  <React.StrictMode>
+    <BrowserRouter>
+      <App assets={window['assetManifest']} />
+    </BrowserRouter>
+  </React.StrictMode>,
+);

package/defaults/app3/frontend/src/pages/Home.tsx

@@ -0,0 +1,15 @@
+export default function Home() {
+  return (
+    <div>
+      <h1 className="my-2 text-xl font-bold">${name}</h1>
+      <h2 className="my-2 text-lg font-bold">Get started</h2>
+      <p>
+        Your LINCD App is ready to go!<br />
+        To edit this file, open:
+        </p>
+      <code className="font-mono my-2 bg-blue-100 p-2 block">
+        <pre>/frontend/src/pages/Home.tsx</pre>
+      </code>
+    </div>
+  );
+}

package/defaults/app3/frontend/src/pages/Page1.scss

@@ -0,0 +1,3 @@
+.page1 {
+  display:block;
+}

package/defaults/app3/frontend/src/pages/Page1.scss.json

@@ -0,0 +1 @@
+{"page1":"test_app_123_Page1_page1"}

package/defaults/app3/frontend/src/pages/Page1.tsx

@@ -0,0 +1,15 @@
+import "./Page1.scss";
+export default function Page1() {
+  return (
+    <div className="page1">
+      This page is styled with SASS. Simply import the relevant .scss file in your code to include it in the bundle.
+      Using this setup, class names will have a global scope.<br />
+      <br />
+      See:
+      <code className="font-mono my-2 bg-blue-100 p-2 block">
+        <pre>/frontend/src/pages/Page1.tsx</pre>
+      </code>
+
+    </div>
+  );
+}

package/defaults/app3/frontend/src/pages/Page2.scss

@@ -0,0 +1,16 @@
+.page2 {
+  display:block;
+  span {
+    font-style:italic;
+  }
+  h1 {
+    font-size:1.5rem;
+  }
+  code {
+    font-family: monospace;
+    margin: 0.5rem 0;
+    background-color:lightcyan;
+    padding: 0.5rem;
+    display:block;
+  }
+}

package/defaults/app3/frontend/src/pages/Page2.scss.json

@@ -0,0 +1 @@
+{"page2":"test_app_123_Page2_page2"}

package/defaults/app3/frontend/src/pages/Page2.tsx

@@ -0,0 +1,21 @@
+import "./Page2.scss";
+import * as style from "./Page2.scss.json";
+export default function Page2() {
+  return (
+    <div className={style.page2}>
+      <h1>Example page using SASS + CSS Modules</h1>
+      This page is styled with SASS + CSS Modules. It imports the relevant .scss file{' '}
+      <span>and the generated .scss.json file</span>.<br />
+      <br />
+      Using this setup your class names will be scoped to the file(s)
+      where you use them. The typescript compiler will also auto complete class names and warn you if you're using class
+      names that don't exists.
+      <br />
+      <br />
+      See:
+      <code>
+        <pre>/frontend/src/pages/Page2.tsx</pre>
+      </code>
+    </div>
+  );
+}

package/defaults/app3/package.json

@@ -0,0 +1,76 @@
+{
+  "name": "${hyphen_name}",
+  "displayName": "${name}",
+  "description": "",
+  "version": "0.1.0",
+  "private": true,
+  "author": "",
+  "engines": {
+    "node": ">=16.0.0"
+  },
+  "main": "backend/src/server.js",
+  "license": "MIT",
+  "scripts": {
+    "start": "npm run server:dev",
+    "start-full": "concurrently --names \"_TSC,SERV\" \"npm run tsc\" \"npm run server:dev\"",
+    "build:prod": "npm run bundler:prod && npm run tsc:prod",
+    "server:dev": "env-cmd -e dev nodemon --watch ../../modules/lincd-server/lib --delay 0.5 ./backend/server.js",
+    "server:prod": "env-cmd -e prod nodemon -e js,json --delay 1 ./backend/server.js",
+    "tsc": "cross-env NODE_ENV=development tsc --watch --project ./tsconfig.json",
+    "tsc:prod": "cross-env NODE_ENV=production tsc --project ./tsconfig.json",
+    "bundler:dev": "cross-env NODE_ENV=development nodemon --watch frontend/scripts frontend/scripts/build.js",
+    "bundler:prod": "cross-env NODE_ENV=production node frontend/scripts/build.js",
+    "setup": "cross-env NODE_ENV=development tsc --project ./tsconfig.json"
+  },
+  "keywords": [
+    "lincd",
+    "linked code",
+    "linked data",
+    "semantic web",
+    "web3"
+  ],
+  "dependencies": {
+    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.7",
+    "fork-ts-checker-webpack-plugin": "6.2.6",
+    "is-object": "^1.0.2",
+    "lincd": "^0.3",
+    "lincd-jsonld": "^0.1",
+    "react": "^18.2",
+    "react-dom": "^18.2",
+    "react-error-boundary": "^3.1.3",
+    "react-refresh": "^0.14.0",
+    "react-refresh-typescript": "^2.0.7",
+    "react-router-dom": "^6.3.0",
+    "webpack-dev-middleware": "^5.3.3",
+    "webpack-hot-middleware": "^2.25.2"
+  },
+  "devDependencies": {
+    "@types/node": "^17.0.30",
+    "@types/react": "^18.0.17",
+    "@types/react-dom": "^18.0.6",
+    "chalk": "4.1.2",
+    "classnames": "^2.3.1",
+    "compression": "^1.7.4",
+    "concurrently": "^5.3.0",
+    "cors": "^2.8.5",
+    "cross-env": "^7.0.3",
+    "env-cmd": "^10.1.0",
+    "css-loader": "^5.2.7",
+    "express": "^4.17.1",
+    "lincd-cli": "^0.1",
+    "mini-css-extract-plugin": "^1.3.3",
+    "nodemon": "^2.0.6",
+    "postcss": "^8.4.14",
+    "postcss-import": "^14.1.0",
+    "postcss-modules": "",
+    "postcss-nested": "^5.0.6",
+    "prettier": "1.19.1",
+    "resolve": "1.12.0",
+    "sass-loader": "^10.0",
+    "tailwindcss": "^3.0.24",
+    "ts-loader": "^8.0.12",
+    "typescript": "4.6.4",
+    "webpack": "4.44.2",
+    "webpack-cli": "^4.2.0"
+  }
+}

package/defaults/app3/tailwind.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+	content: ['./frontend/src/**/*.{tsx,ts}'],
+};

package/defaults/app3/tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "compilerOptions": {
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "sourceMap": true,
+    "target": "es2019",
+    "declaration": false,
+    "experimentalDecorators": true,
+    "emitDecoratorMetadata": true,
+    "esModuleInterop": true,
+    "resolveJsonModule": true,
+    "jsx": "react-jsx",
+    "types": ["node", "react", "react-dom"],
+    "pretty": true
+  },
+  "files": ["./frontend/src/index.tsx"]
+}

package/defaults/module/package.json

@@ -29,7 +29,7 @@
     "web3"
   ],
   "dependencies": {
-    "lincd": "^0.2",
+    "lincd": "^0.3",
     "lincd-jsonld": "^0.1"
   },
   "devDependencies": {

package/defaults/module/src/ontologies/example-ontology.ts

@@ -1,5 +1,5 @@
 import {NamedNode} from 'lincd/lib/models';
-import {JSONLD} from 'lincd-jsonld/lib/JSONLD';
+import {JSONLD} from 'lincd-jsonld/lib/utils/JSONLD';
 import {createNameSpace} from 'lincd/lib/utils/NameSpace';
 import {linkedOntology} from '../module';
 //import all the exports of this file as one variable called _this (we need this at the end)

package/lib/cli.js

@@ -62,7 +62,7 @@ program
     return createApp(name);
 })
     .description('Creates a new folder with all the required files for a LINCD app')
-    .argument('<name>', 'the name of your LINCD app');
+    .argument('<name>', 'the name of your LINCD app. To use spaces, wrap the name in double quotes.');
 program
     .command('create-module')
     .action(function (name, uriBase) {
@@ -138,12 +138,15 @@ program.command('dev [target] [mode]').action(function (target, mode) {
 program
     .command('module|m')
     .action(function (name, command, args) {
-    var fullCommand = (command ? command + ' ' +
-        ' ' +
-        args
-            .slice(0, 3)
-            .filter(function (a) { return a && true; })
-            .join(' ') : null);
+    var fullCommand = command
+        ? command +
+            ' ' +
+            ' ' +
+            args
+                .slice(0, 3)
+                .filter(function (a) { return a && true; })
+                .join(' ')
+        : null;
     executeCommandForModule(name, fullCommand);
 })
     .alias('m')
@@ -819,7 +822,7 @@ var createModule = function (name, uriBase, basePath) {
 var createApp = function (name, basePath) {
     if (basePath === void 0) { basePath = process.cwd(); }
     return __awaiter(void 0, void 0, void 0, function () {
-        var _a, hyphenName, camelCaseName, underscoreName, targetFolder, hasYarn, installCommand, lincdCommand;
+        var _a, hyphenName, camelCaseName, underscoreName, targetFolder, hasYarn, installCommand, runCommand;
         return __generator(this, function (_b) {
             switch (_b.label) {
                 case 0:
@@ -831,30 +834,22 @@ var createApp = function (name, basePath) {
                     if (!fs.existsSync(targetFolder)) {
                         fs.mkdirSync(targetFolder);
                     }
-                    fs.copySync(path.join(__dirname, '..', 'defaults', 'app'), targetFolder);
-                    // let codeName = cleanPackageName.replace(/\-/g, '_');
-                    // let cameCaseName = camelCase(name); //some-module --> someModule
-                    // let underscoreName = name.replace(/[-\s]+/g, '_');
-                    // setVariable('uri_base', uriBase);
-                    //longer similar variables names should come before the shorter ones
-                    // setVariable('camelcase_name', cameCaseName);
-                    // setVariable('underscore_name', underscoreName);
-                    // setVariable('app_name', name);
+                    fs.copySync(path.join(__dirname, '..', 'defaults', 'app3'), targetFolder);
+                    // fs.copySync(path.join(__dirname, '..', 'defaults', 'app'), targetFolder);
                     log("Creating new LINCD application '" + name + "'");
                     //replace variables in some of the copied files
-                    replaceVariablesInFilesWithRoot(targetFolder, 'package.json', 'index.html', 'Gruntfile.js', 'src/index.tsx', 'src/App.tsx');
+                    replaceVariablesInFilesWithRoot(targetFolder, 'package.json', 'frontend/src/App.tsx', 'frontend/src/Header.tsx', 'frontend/src/pages/Home.tsx');
                     return [4 /*yield*/, hasYarnInstalled()];
                 case 1:
                     hasYarn = _b.sent();
                     installCommand = hasYarn ? 'yarn install' : 'npm install';
-                    lincdCommand = hasYarn ? 'yarn lincd' : 'npm exec lincd';
-                    return [4 /*yield*/, execp("cd ".concat(hyphenName, " && ").concat(installCommand, " && ").concat(hasYarn ? 'yarn' : 'npm exec', " lincd build"), true)["catch"](function (err) {
-                            console.warn('Could not install dependencies');
+                    runCommand = hasYarn ? 'yarn' : 'npm run';
+                    return [4 /*yield*/, execp("cd ".concat(hyphenName, " && ").concat(installCommand, " && ").concat(runCommand, " setup"), true)["catch"](function (err) {
+                            console.warn('Could not install dependencies or start application');
                         })];
                 case 2:
                     _b.sent();
-                    open(path.join(targetFolder, 'index.html'));
-                    log("Your LINCD App starting setup is ready.", "Run ".concat(chalk.blueBright('cd ' + hyphenName), " and then \n  - ").concat(chalk.blueBright(lincdCommand + ' build'), " to build once or \n  - ").concat(chalk.blueBright(lincdCommand + ' dev'), " to continuously rebuild on file changes"));
+                    log("Your LINCD App is ready at ".concat(chalk.blueBright(targetFolder)), "To start, run\n".concat(chalk.blueBright("cd ".concat(hyphenName)), " and then ").concat(chalk.blueBright((hasYarn ? 'yarn' : 'npm') + ' start')));
                     return [2 /*return*/];
             }
         });
@@ -918,6 +913,7 @@ var register = function (registryURL) {
         var version = pack.version;
         var moduleName = pack.name;
         var author = pack.author;
+        var description = pack.description;
         console.log(chalk.cyan('registering ' + author + "'s module, " + moduleName + ' ' + version + ' in the LINCD registry'));
         return fetch(registryURL + '/register', {
             method: 'POST',
@@ -925,7 +921,7 @@ var register = function (registryURL) {
                 Accept: 'application/json, text/plain, */*',
                 'Content-Type': 'application/json'
             },
-            body: JSON.stringify({ package: moduleName, version: version })
+            body: JSON.stringify({ package: moduleName, version: version, description: description })
         })
             .then(function (res) { return res.json(); })
             .then(function (json) {
@@ -1224,7 +1220,7 @@ var executeCommandForModule = function (moduleName, command) {
         return execp('cd ' + moduleDetails.path + ' && yarn lincd' + (command ? ' ' + command : ''));
     }
     else {
-        warn("Could not find a module who\'s name (partially) matched " + chalk.cyan(moduleName));
+        warn("Could not find a module who's name (partially) matched " + chalk.cyan(moduleName));
     }
 };
 program.parse(process.argv);

package/lib/config-grunt.js

@@ -22,8 +22,8 @@ function generateGruntConfig(moduleName, config) {
 }
 exports["default"] = generateGruntConfig;
 function setupGrunt(grunt, moduleName, config) {
-    var buildServer = !config.environment || config.environment == 'server';
-    var buildFrontend = !config.environment || config.environment == 'frontend';
+    var buildServer = !config.environment || config.environment == 'nodejs' || config.environment == 'polymorphic';
+    var buildFrontend = !config.environment || config.environment == 'browser' || config.environment == 'polymorphic';
     //when not specified and we ARe building frontend OR we are compiling the server for es5.. or if simply specified, then es5 is targeted
     var targetES5 = (!config.target && (buildFrontend || config.es5Server)) || config.target == 'es5';
     var targetES6 = !config.target || config.target == 'es6';

package/lib/config-webpack.js

@@ -78,16 +78,28 @@ function generateWebpackConfig(buildName, moduleName, config) {
     if (config.debug) {
         plugins.push(new watch_run_1["default"]());
     }
-    if (config.afterBuildCommand) {
+    if (config.afterBuildCommand || config.afterFirstBuildCommand) {
+        var executedFirstCommand_1 = false;
         plugins.push({
             apply: function (compiler) {
                 compiler.hooks.afterEmit.tap('AfterEmitPlugin', function (compilation) {
-                    exec(config.afterBuildCommand, function (err, stdout, stderr) {
-                        if (stdout)
-                            process.stdout.write(stdout);
-                        if (stderr)
-                            process.stderr.write(stderr);
-                    });
+                    if (config.afterBuildCommand) {
+                        exec(config.afterBuildCommand, function (err, stdout, stderr) {
+                            if (stdout)
+                                process.stdout.write(stdout);
+                            if (stderr)
+                                process.stderr.write(stderr);
+                        });
+                    }
+                    if (config.afterFirstBuildCommand && !executedFirstCommand_1) {
+                        executedFirstCommand_1 = true;
+                        exec(config.afterFirstBuildCommand, function (err, stdout, stderr) {
+                            if (stdout)
+                                process.stdout.write(stdout);
+                            if (stderr)
+                                process.stderr.write(stderr);
+                        });
+                    }
                 });
             }
         });

package/lib/utils.js

@@ -31,7 +31,7 @@ var fs = __importStar(require("fs"));
 var path = __importStar(require("path"));
 var SHACL_1 = require("lincd/lib/shapes/SHACL");
 var CoreSet_1 = require("lincd/lib/collections/CoreSet");
-var JSONLDWriter_1 = require("lincd-jsonld/lib/JSONLDWriter");
+var JSONLDWriter_1 = require("lincd-jsonld/lib/utils/JSONLDWriter");
 var chalk_1 = __importDefault(require("chalk"));
 var getPackageJSON = function (root, error) {
     if (root === void 0) { root = process.cwd(); }

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "lincd-cli",
-  "version": "0.1.11",
+  "version": "0.1.12",
   "description": "Command line tools for the lincd.js library",
   "main": "lib/index.js",
   "scripts": {
     "prepublishOnly": "npm exec tsc",
-    "build": "npm exec tsc"
+    "build": "npm exec tsc",
+    "dev": "npm exec tsc -w"
   },
   "lincd_util": true,
   "keywords": [
@@ -44,7 +45,7 @@
     "grunt-ts": "^6.0.0-beta.22",
     "grunt-webpack": "^4.0.2",
     "license-info-webpack-plugin": "^3.0.0",
-    "lincd": "^0.2",
+    "lincd": "^0.3",
     "lincd-jsonld": "^0.1.4",
     "load-grunt-tasks": "^5.1.0",
     "mini-css-extract-plugin": "^1.3.3",