OSOE-84: Update documentation, minor adjustments for compatibility with NE

Lombiq.VueJs.Samples/ResourceManagementOptionsConfiguration.cs

@@ -35,4 +35,4 @@ static ResourceManagementOptionsConfiguration()
     public void Configure(ResourceManagementOptions options) => options.ResourceManifests.Add(_manifest);
 }
 
-// NEXT STATION: Gulpfile.js
+// NEXT STATION: package.json

Lombiq.VueJs.Samples/Views/VueSfc/EnhancedList.cshtml

@@ -1,11 +1,7 @@
-@model Lombiq.VueJs.Samples.ViewModels.EnhancedListViewModel
+@model Lombiq.VueJs.Samples.ViewModels.EnhancedListViewModel
 
 @{
-    var dependencies = string.Join(", ", new string[]
-    {
-        ResourceNames.EnhancementControl,
-        ResourceNames.EnhancementTableBody,
-    });
+    var dependencies = string.Join(", ", ResourceNames.EnhancementControl, ResourceNames.EnhancementTableBody);
 }
 
 <form id="enhanced-list">

Lombiq.VueJs/.npmrc

@@ -1,9 +1,8 @@
 ; See https://pnpm.io/cli/run#shell-emulator for details.
 shell-emulator = true
 
+; Print as few commands to the console as possible.
+loglevel = warn
+
 ; Fixing "missing package" error for airbnb eslint config.
 auto-install-peers = true
-
-; Skip adding NODE_PATH to binstubs (in /.bin) which can become extremely long for long directory names.
-; Removed in pnpm@7, because it's the built-in behavior there.
-extend-node-path = false

Lombiq.VueJs/Assets/Scripts/helpers/process-helpers.js

@@ -1,4 +1,4 @@
-const { handleErrorObject, handleErrorMessage } = require('nodejs-extensions/scripts/handle-error');
+const { handleErrorObject, handleErrorMessage } = require('.nx/scripts/handle-error');
 const path = require('path');
 
 async function executeFunctionByCommandLineArgument(functions) {
@@ -21,8 +21,8 @@ async function executeFunctionByCommandLineArgument(functions) {
 
         if (!target) helpAndExit(`Couldn't find the function "${functionName}".`);
 
-        // Execute the function with the provided options object, if any. If it's a thenable object (e.g. Promise), then
-        // it's also awaited.
+        // #spell-check-ignore-line: Execute the function with the provided options object, if any. If it's a thenable
+        // object (e.g. Promise), then it's also awaited.
         const task = target[1](argumentOptions);
         if (task && task.then) await task;
     }

Lombiq.VueJs/Assets/Scripts/helpers/rollup-pipeline.js

@@ -3,7 +3,7 @@ const path = require('path');
 const { minify } = require('terser');
 const { rollup } = require('rollup');
 
-const { handleErrorObject, handlePromiseRejectionAsError } = require('nodejs-extensions/scripts/handle-error');
+const { handleErrorObject, handlePromiseRejectionAsError } = require('.nx/scripts/handle-error');
 
 function createDirectory(directoryPath) {
     return fs.existsSync(directoryPath) ? Promise.resolve() : fs.promises.mkdir(directoryPath, { recursive: true });

Lombiq.VueJs/Assets/Scripts/helpers/rollup-plugin-vue-sfc-orchard-core.js

@@ -3,7 +3,7 @@ const sourceMap = require('source-map');
 const readFile = require('fs').promises.readFile;
 const { ESLint } = require('eslint');
 
-const { formatter } = require('nodejs-extensions/scripts/eslint-msbuild-formatter');
+const { formatter } = require('.nx/scripts/eslint-msbuild-formatter');
 
 function onlyScript(source) {
     for (let i = 0; i < source.length; i++) {

Lombiq.VueJs/Lombiq.VueJs.csproj

@@ -48,7 +48,7 @@
 
   <ItemGroup Condition="'$(NuGetBuild)' == 'true'">
     <PackageReference Include="Lombiq.HelpfulLibraries.OrchardCore" Version="5.1.0" />
-    <PackageReference Include="Lombiq.NodeJs.Extensions" Version="1.0.0-alpha.osoe-84.4" />
+    <PackageReference Include="Lombiq.NodeJs.Extensions" Version="1.0.0-alpha5.osoe-84" />
   </ItemGroup>
 
   <Import Condition="'$(NuGetBuild)' != 'true'" Project="..\..\..\Utilities\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions\Lombiq.NodeJs.Extensions.targets" />

Lombiq.VueJs/Lombiq.VueJs.props

@@ -1,7 +1,8 @@
 <Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
 
   <PropertyGroup>
-    <LombiqVueJsNpmPackageSourcePath>./node_modules/.lv</LombiqVueJsNpmPackageSourcePath>
+    <LombiqVueJsNpmPackageSourcePath Condition="'$(NodeJsExtensionsNpmPackageSourcePath)' == ''">./node_modules/.lv</LombiqVueJsNpmPackageSourcePath>
+    <LombiqVueJsNpmPackageSourcePath Condition="'$(NodeJsExtensionsNpmPackageSourcePath)' != ''">$(NodeJsExtensionsNpmPackageSourcePath)/../.lv</LombiqVueJsNpmPackageSourcePath>
     <LombiqVueJsInstallationPath>$(MSBuildThisFileDirectory.TrimEnd('/\'))</LombiqVueJsInstallationPath>
   </PropertyGroup>
 

Lombiq.VueJs/Lombiq.VueJs.targets

@@ -1,6 +1,6 @@
 <Project>
   <Target Name="InstallLombiqVueJsPackage"
-          AfterTargets="AddNodeJsExtensionsAsNpmPackage">
+          AfterTargets="InstallNodeJsExtensionsNpmPackage">
     <Message
       Text="Copying Lombiq.VueJs files to $(LombiqVueJsNpmPackageSourcePath):%0a - @(LombiqVueJsNpmPackageFiles,'%0a - ')"
       Importance="$(_Importance)" />
@@ -15,7 +15,7 @@
     <Exec Command="pnpm link $(LombiqVueJsNpmPackageSourcePath)" />
   </Target>
 
-  <Target Name="DeleteLombiqVueJsNpmPackage" AfterTargets="DeleteNodeJsExtensionsNpmPackage">
+  <Target Name="DeleteLombiqVueJsNpmPackage" AfterTargets="CleanNodeJsExtensionsNpmPackage">
     <ItemGroup>
       <LombiqVueJsNpmPackageFoldersToDelete Condition="!Exists($(LombiqVueJsNpmPackageSourcePath))" />
       <LombiqVueJsNpmPackageFoldersToDelete

Lombiq.VueJs/package.json

@@ -11,21 +11,21 @@
     "vuelidate": "0.7.4"
   },
   "devDependencies": {
+    "@rollup/plugin-alias": "^3.1.9",
+    "@rollup/plugin-commonjs": "^22.0.2",
+    "@rollup/plugin-json": "^4.1.0",
+    "@rollup/plugin-node-resolve": "^14.1.0",
+    "@rollup/plugin-replace": "^4.0.0",
     "@vue/compiler-sfc": "^3.2.29",
+    "del": "^6.0.0",
     "eslint": "^8.17.0",
     "fancy-log": "^2.0.0",
     "fs": "^0.0.1-security",
     "glob": "^8.0.3",
+    "npm-run-all": "^4.1.5",
     "rollup": "^2.79.1",
-    "@rollup/plugin-alias": "^3.1.9",
-    "@rollup/plugin-commonjs": "^22.0.2",
     "rollup-plugin-eslint": "^7.0.0",
-    "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-node-resolve": "^14.1.0",
-    "@rollup/plugin-replace": "^4.0.0",
-    "terser": "^5.15.0",
-    "del": "^6.0.0",
-    "npm-run-all": "^4.1.5"
+    "terser": "^5.15.0"
   },
   "scripts": {
     "build": "run-p --print-name --continue-on-error \"build:*\"",

Readme.md

@@ -128,7 +128,14 @@ If your Vue app is just going to include one top level component and bind to tha
 - Including a script element in your template will break it. Although you shouldn't do that anyway.
 - As you might expect from Orchard Core, the style element isn't supported either since you will be using themes. If you can think of a use-case that's applicable for OC, please open an issue.
 
-Regarding the points: if you need anything more complicated, first reconsider you application design to see if your goals can be achieved in a more Vue.js logic. For example pass the variables in your main app that hands them down via property binding. If you still need something else, either use a _cshtml_ templated app as outlined above or use shape overriding on the `VueComponent-{FileNameInPascalCase}` shape.
+Regarding the points: If you need anything more complicated, first reconsider your application design to see if your goals can be achieved in a more Vue.js logic. For example, pass the variables in your main app that hands them down via property binding. If you still need something else, either use a _cshtml_ templated app as outlined above or use shape overriding on the `VueComponent-{FileNameInPascalCase}` shape.
+
+## Dependencies
+
+This module has the following dependencies:
+
+- [Lombiq Helpful Libraries for Orchard Core](https://github.com/Lombiq/Helpful-Libraries)
+- [Lombiq Node.js Extensions](https://gihub.com/Lombiq/NodeJs-Extensions)
 
 ## Contributing and support