Getting the monaco editor to work in NR 2.x

(This is today's dumb question from me)

I was sure I installed it on my machine/s but now can't find it on any (without turning on all the ones that are off).

I was sure that I read the recent post on how to do it, and did it and got it working.
I'm not sure why/how but I suddenly noticed that it is the older ace editor.

Searching through the posts, I am not really seeing how to get it installed and working.

I seem to remember that as of NR 2.x it is included and all I needed to do was change a couple of lines.

But looking at the settings.js file I can't even find the code for the older/original editor.

Following the github link, I see this:

        codeEditor: {
            /** Select the text editor component used by the editor.
             * As of Node-RED V3, this defaults to "monaco", but can be set to "ace" if desired
             */
            lib: "monaco",

So is it just a case of adding that and the editor would be changed?

Because there was only one editor pre v2.1 (so no setting)

Yes, inside of editorTheme

    editorTheme: {
        codeEditor: {
            lib: "monaco", //can be "monaco" or "ace"
            options: {
                // /* theme - must match the file name of a theme in 
                //  * packages/node_modules/@node-red/editor-client/src/vendor/monaco/dist/theme
                //  * e.g. "tomorrow-night", "upstream-sunburst", "github", "my-theme"
                //  */
                theme: "vs-dark",
            }
        }
    }

NOTES.

  1. I added theme as I know you run a dark theme
  2. You really should just delete your settings file & let node-red build a new up-to-date one for you - (yours is clearly well out of date)
2 Likes

So I can delete the settings.js file then start NR and things would work themselves out.....

I thought (wrongly) that that file was essential to it running.

I stopped node-red, deleted the file and started node-red.

Now there is no settings.js file.
So I'm stuck where to exactly put those lines now.

Unless I make a new settings.js file and just put that in.
But I fear it isn't that easy.
(Sorry)

($hit!)

(And luckily I backed up first)

I have lost all the flows too.

if you deleted the correct settings.js and restart node-red it WILL generate a new one.

Did you refresh the file explorer after restarting node-red?

Explain what you did in detail (file paths, start up log etc)

Ok,

cd .node-red
node-red-stop
rm settings.js
node-red-start

The first time there was nothing shown when it started - which kind of set off alarms for me.

The second time I stopped/started I got things shown.

(Given that Node-red was already stopped when I did this below)

me@me-desktop:~/.node-red$ rm settings.js 
me@me-desktop:~/.node-red$ node-red-start

Start Node-RED
 
Once Node-RED has started, point a browser at http://192.168.0.6:1880
On Pi Node-RED works better with the Firefox or Chrome browser
 
Use   node-red-stop                          to stop Node-RED
Use   node-red-start                         to start Node-RED again
Use   node-red-log                           to view the recent log output
Use   sudo systemctl enable nodered.service  to autostart Node-RED at every boot
Use   sudo systemctl disable nodered.service to disable autostart on boot
 
To find more nodes and example flows - go to http://flows.nodered.org
 
Starting as a systemd service.
^C
me@me-desktop:~/.node-red$ node-red-stop
Stop Node-RED
 
Use   node-red-start   to start Node-RED again
 
me@me-desktop:~/.node-red$ node-red-start

Start Node-RED
 
Once Node-RED has started, point a browser at http://192.168.0.6:1880
On Pi Node-RED works better with the Firefox or Chrome browser
 
Use   node-red-stop                          to stop Node-RED
Use   node-red-start                         to start Node-RED again
Use   node-red-log                           to view the recent log output
Use   sudo systemctl enable nodered.service  to autostart Node-RED at every boot
Use   sudo systemctl disable nodered.service to disable autostart on boot
 
To find more nodes and example flows - go to http://flows.nodered.org
 
Starting as a systemd service.
22 Jul 17:18:45 - [info]
Welcome to Node-RED
===================
22 Jul 17:18:45 - [info] Node-RED version: v2.1.4
22 Jul 17:18:45 - [info] Node.js  version: v12.22.2
22 Jul 17:18:45 - [info] Linux 5.11.0-49-generic x64 LE
22 Jul 17:18:45 - [info] Loading palette nodes
22 Jul 17:18:46 - [info] +-----------------------------------------------------
22 Jul 17:18:46 - [info] | uibuilder initialised:
22 Jul 17:18:46 - [info] |   root folder: /home/me/.node-red/uibuilder
22 Jul 17:18:46 - [info] |   version . .: 2.0.1
22 Jul 17:18:46 - [info] |   packages . : vue,bootstrap,bootstrap-vue,jquery,socket.io
22 Jul 17:18:46 - [info] +-----------------------------------------------------
22 Jul 17:18:47 - [info] Dashboard version 3.1.7 started at /ui
22 Jul 17:18:47 - [warn] ------------------------------------------------------
22 Jul 17:18:47 - [warn] [node-red-node-sqlite/sqlite] Error: Cannot find module '/home/me/.node-red/node_modules/sqlite3/lib/binding/node-v72-linux-x64/node_sqlite3.node'
Require stack:
- /home/me/.node-red/node_modules/sqlite3/lib/sqlite3.js
- /home/me/.node-red/node_modules/node-red-node-sqlite/sqlite.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/registry/lib/loader.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/registry/lib/index.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/runtime/lib/nodes/index.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/runtime/lib/index.js
- /usr/lib/node_modules/node-red/lib/red.js
- /usr/lib/node_modules/node-red/red.js
22 Jul 17:18:47 - [warn] [node-red-contrib-play-soundfile/config-soundfile] Error: Cannot find module '/home/me/.node-red/node_modules/node-red-contrib-play-soundfile/config-soundfile.js'
Require stack:
- /usr/lib/node_modules/node-red/node_modules/@node-red/registry/lib/loader.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/registry/lib/index.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/runtime/lib/nodes/index.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/runtime/lib/index.js
- /usr/lib/node_modules/node-red/lib/red.js
- /usr/lib/node_modules/node-red/red.js
22 Jul 17:18:47 - [warn] ------------------------------------------------------
22 Jul 17:18:47 - [info] Settings file  : /home/me/.node-red/settings.js
22 Jul 17:18:47 - [info] Context store  : 'default' [module=memory]
22 Jul 17:18:47 - [info] User directory : /home/me/.node-red
22 Jul 17:18:47 - [warn] Projects disabled : editorTheme.projects.enabled=false
22 Jul 17:18:47 - [info] Flows file     : /home/me/.node-red/flows.json
22 Jul 17:18:47 - [info] Creating new flow file
22 Jul 17:18:47 - [warn]
---------------------------------------------------------------------
Your flow credentials file is encrypted using a system-generated key.
If the system-generated key is lost for any reason, your credentials
file will not be recoverable, you will have to delete it and re-enter
your credentials.
You should set your own key using the 'credentialSecret' option in
your settings file. Node-RED will then re-encrypt your credentials
file using your chosen key the next time you deploy a change.
---------------------------------------------------------------------
22 Jul 17:18:47 - [info] Server now running at http://127.0.0.1:1880/
22 Jul 17:18:47 - [info] Starting flows
22 Jul 17:18:47 - [info] Started flows

So it would seem I am stuck with how to do what you said @Steve-Mcl.

Sorry.

Yes, it would be nice if I could get that working as smoothly as you say, but for what ever reason if/when I delete the settings.js file and restart node-red it (node-red) doesn't seem to acknowledge the existing .json files and just gives me a blank work area.

Hang on and I'll post the settings.js file.

/**
 * Copyright JS Foundation and other contributors, http://js.foundation
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 **/

// The `https` setting requires the `fs` module. Uncomment the following
// to make it available:
//var fs = require("fs");

module.exports = {
    // the tcp port that the Node-RED web server is listening on
    uiPort: process.env.PORT || 1880,

    // By default, the Node-RED UI accepts connections on all IPv4 interfaces.
    // The following property can be used to listen on a specific interface. For
    // example, the following would only allow connections from the local machine.
    //uiHost: "127.0.0.1",

    // Retry time in milliseconds for MQTT connections
    mqttReconnectTime: 15000,

    // Retry time in milliseconds for Serial port connections
    serialReconnectTime: 15000,

    // Retry time in milliseconds for TCP socket connections
    //socketReconnectTime: 10000,

    // Timeout in milliseconds for TCP server socket connections
    //  defaults to no timeout
    //socketTimeout: 120000,

    // Timeout in milliseconds for HTTP request connections
    //  defaults to 120 seconds
    //httpRequestTimeout: 120000,

    // The maximum length, in characters, of any message sent to the debug sidebar tab
    debugMaxLength: 1000,

    // The maximum number of messages nodes will buffer internally as part of their
    // operation. This applies across a range of nodes that operate on message sequences.
    //  defaults to no limit. A value of 0 also means no limit is applied.
    //nodeMaxMessageBufferLength: 0,

    // To disable the option for using local files for storing keys and certificates in the TLS configuration
    //  node, set this to true
    //tlsConfigDisableLocalFiles: true,

    // Colourise the console output of the debug node
    //debugUseColors: true,

    // The file containing the flows. If not set, it defaults to flows_<hostname>.json
    //flowFile: 'flows.json',

    // To enabled pretty-printing of the flow within the flow file, set the following
    //  property to true:
    //flowFilePretty: true,

    // By default, credentials are encrypted in storage using a generated key. To
    // specify your own secret, set the following property.
    // If you want to disable encryption of credentials, set this property to false.
    // Note: once you set this property, do not change it - doing so will prevent
    // node-red from being able to decrypt your existing credentials and they will be
    // lost.
    //credentialSecret: "a-secret-key",
    //credentialSecret: 'MaryHadALittleLamb',

    // By default, all user data is stored in the Node-RED install directory. To
    // use a different location, the following property can be used
    //userDir: '/home/nol/.node-red/',
    //userDir: '/home/me/.node-red/',

    // Node-RED scans the `nodes` directory in the install directory to find nodes.
    // The following property can be used to specify an additional directory to scan.
    //nodesDir: '/home/nol/.node-red/nodes',

    // By default, the Node-RED UI is available at http://localhost:1880/
    // The following property can be used to specify a different root path.
    // If set to false, this is disabled.
    //httpAdminRoot: '/admin',

    // Some nodes, such as HTTP In, can be used to listen for incoming http requests.
    // By default, these are served relative to '/'. The following property
    // can be used to specifiy a different root path. If set to false, this is
    // disabled.
    //httpNodeRoot: '/red-nodes',

    // The following property can be used in place of 'httpAdminRoot' and 'httpNodeRoot',
    // to apply the same root to both parts.
    //httpRoot: '/red',

    // When httpAdminRoot is used to move the UI to a different root path, the
    // following property can be used to identify a directory of static content
    // that should be served at http://localhost:1880/.
    //httpStatic: '/home/nol/node-red-static/',
    httpStatic: '/home/me/.node-red/public/',

    // The maximum size of HTTP request that will be accepted by the runtime api.
    // Default: 5mb
    //apiMaxLength: '5mb',

    // If you installed the optional node-red-dashboard you can set it's path
    // relative to httpRoot
    //ui: { path: "ui" },

    // Securing Node-RED
    // -----------------
    // To password protect the Node-RED editor and admin API, the following
    // property can be used. See http://nodered.org/docs/security.html for details.

    //  Put new password stuff here.

    //adminAuth: {
    //    type: "credentials",
    //    users: [{
    //        username: "admin",
    //        password: "$2a$08$zZWtXTja0fB1pzD4sHCMyOCMYz2Z6dNbM6tl8sJogENOMcxWV9DN.",
    //        permissions: "*"
    //    }]
    //},

    // To password protect the node-defined HTTP endpoints (httpNodeRoot), or
    // the static content (httpStatic), the following properties can be used.
    // The pass field is a bcrypt hash of the password.
    // See http://nodered.org/docs/security.html#generating-the-password-hash
    //httpNodeAuth: {user:"user",pass:"$2a$08$zZWtXTja0fB1pzD4sHCMyOCMYz2Z6dNbM6tl8sJogENOMcxWV9DN."},
    //httpStaticAuth: {user:"user",pass:"$2a$08$zZWtXTja0fB1pzD4sHCMyOCMYz2Z6dNbM6tl8sJogENOMcxWV9DN."},

    // The following property can be used to enable HTTPS
    // See http://nodejs.org/api/https.html#https_https_createserver_options_requestlistener
    // for details on its contents.
    // See the comment at the top of this file on how to load the `fs` module used by
    // this setting.
    //

    //https: {
    //    key: fs.readFileSync('privatekey.pem'),
    //    cert: fs.readFileSync('certificate.pem')
    //},

    // The following property can be used to cause insecure HTTP connections to
    // be redirected to HTTPS.
    //requireHttps: true

    // The following property can be used to disable the editor. The admin API
    // is not affected by this option. To disable both the editor and the admin
    // API, use either the httpRoot or httpAdminRoot properties
    //disableEditor: false,

    // The following property can be used to configure cross-origin resource sharing
    // in the HTTP nodes.
    // See https://github.com/troygoode/node-cors#configuration-options for
    // details on its contents. The following is a basic permissive set of options:
    //httpNodeCors: {
    //    origin: "*",
    //    methods: "GET,PUT,POST,DELETE"
    //},

    // If you need to set an http proxy please set an environment variable
    // called http_proxy (or HTTP_PROXY) outside of Node-RED in the operating system.
    // For example - http_proxy=http://myproxy.com:8080
    // (Setting it here will have no effect)
    // You may also specify no_proxy (or NO_PROXY) to supply a comma separated
    // list of domains to not proxy, eg - no_proxy=.acme.co,.acme.co.uk

    // The following property can be used to add a custom middleware function
    // in front of all http in nodes. This allows custom authentication to be
    // applied to all http in nodes, or any other sort of common request processing.
    //httpNodeMiddleware: function(req,res,next) {
    //    // Handle/reject the request, or pass it on to the http in node by calling next();
    //    // Optionally skip our rawBodyParser by setting this to true;
    //    //req.skipRawBodyParser = true;
    //    next();
    //},

    // The following property can be used to verify websocket connection attempts.
    // This allows, for example, the HTTP request headers to be checked to ensure
    // they include valid authentication information.
    //webSocketNodeVerifyClient: function(info) {
    //    // 'info' has three properties:
    //    //   - origin : the value in the Origin header
    //    //   - req : the HTTP request
    //    //   - secure : true if req.connection.authorized or req.connection.encrypted is set
    //    //
    //    // The function should return true if the connection should be accepted, false otherwise.
    //    //
    //    // Alternatively, if this function is defined to accept a second argument, callback,
    //    // it can be used to verify the client asynchronously.
    //    // The callback takes three arguments:
    //    //   - result : boolean, whether to accept the connection or not
    //    //   - code : if result is false, the HTTP error status to return
    //    //   - reason: if result is false, the HTTP reason string to return
    //},

    // Anything in this hash is globally available to all functions.
    // It is accessed as context.global.
    // eg:
    //    functionGlobalContext: { os:require('os') }
    // can be accessed in a function block as:
    //    context.global.os

    functionGlobalContext: {
        // os:require('os'),
        // octalbonescript:require('octalbonescript'),
        // jfive:require("johnny-five"),
        // j5board:require("johnny-five").Board({repl:false})
    },

    // The following property can be used to order the categories in the editor
    // palette. If a node's category is not in the list, the category will get
    // added to the end of the palette.
    // If not set, the following default order is used:
    //paletteCategories: ['subflows', 'input', 'output', 'function', 'social', 'mobile', 'storage', 'analysis', 'advanced'],

    // Configure the logging output
    logging: {
        // Only console logging is currently supported
        console: {
            // Level of logging to be recorded. Options are:
            // fatal - only those errors which make the application unusable should be recorded
            // error - record errors which are deemed fatal for a particular request + fatal errors
            // warn - record problems which are non fatal + errors + fatal errors
            // info - record information about the general running of the application + warn + error + fatal errors
            // debug - record information which is more verbose than info + info + warn + error + fatal errors
            // trace - record very detailed logging + debug + info + warn + error + fatal errors
            // off - turn off all logging (doesn't affect metrics or audit)
            level: "info",
            // Whether or not to include metric events in the log output
            metrics: false,
            // Whether or not to include audit events in the log output
            audit: false
        }
    },


    //  2020 04 29  Added theme
    //  2022 01 25  Updated to latest version.

    editorTheme: {
        theme: "midnight-red"
    }

/*    codeEditor: {
        /** Select the text editor component used by the editor.
         * As of Node-RED V3, this defaults to "monaco", but can be set to "ace" if desired
         */
//        lib: "monaco",
//        options: {
            /** The follow options only apply if the editor is set to "monaco"
             *
             * theme - must match the file name of a theme in
             * packages/node_modules/@node-red/editor-client/src/vendor/monaco/dist/theme
             * e.g. "tomorrow-night", "upstream-sunburst", "github", "my-theme"
             */
            // theme: "vs",
            /** other overrides can be set e.g. fontSize, fontFamily, fontLigatures etc.
             * for the full list, see https://microsoft.github.io/monaco-editor/api/interfaces/monaco.editor.IStandaloneEditorConstructionOptions.html
             */
            //fontSize: 14,
            //fontFamily: "Cascadia Code, Fira Code, Consolas, 'Courier New', monospace",
            //fontLigatures: true,
//        }
//    }
}

Towards the bottom (lines 257,258, 272 273) are what I gathered were needed to get the new editor working.
I put them in (without the leading // but node-red just complains when started.

Hmmm, cant remember if monaco was introduced in v2.1 or 2.2

Can you be more explicit when you remove settings.js e.g...

node-red-stop
cd /home/me/.node-red
rm settings.js

then start node-red (not the service)

# DONT DO node-red-start - instead just do node-red
node-red

Ok, sorry...

What's the difference between node-red-start and node-red?

Hang on and I'll try again.

unsurprising, that is not how i said it should be.

You put codeEditor outside of editorTheme I said...

Ok, maybe I goofed, but I CUT/PASTED the code.

Maybe I am getting that confused with what happened.

Hang on and I'll do it again.
(And again: sorry)

Ok try 2:

me@me-desktop:~/.node-red$ node-red-stop
Stop Node-RED
 
Use   node-red-start   to start Node-RED again
 
me@me-desktop:~/.node-red$ rm settings.js 
me@me-desktop:~/.node-red$ node-red
22 Jul 17:37:52 - [info] 

Welcome to Node-RED
===================

22 Jul 17:37:52 - [info] Node-RED version: v2.1.4
22 Jul 17:37:52 - [info] Node.js  version: v12.22.2
22 Jul 17:37:52 - [info] Linux 5.11.0-49-generic x64 LE
22 Jul 17:37:52 - [info] Loading palette nodes
22 Jul 17:37:54 - [info] +-----------------------------------------------------
22 Jul 17:37:54 - [info] | uibuilder initialised:
22 Jul 17:37:54 - [info] |   root folder: /home/me/.node-red/uibuilder
22 Jul 17:37:54 - [info] |   version . .: 2.0.1
22 Jul 17:37:54 - [info] |   packages . : vue,bootstrap,bootstrap-vue,jquery,socket.io
22 Jul 17:37:54 - [info] +-----------------------------------------------------
22 Jul 17:37:54 - [info] Dashboard version 3.1.7 started at /ui
22 Jul 17:37:54 - [warn] ------------------------------------------------------
22 Jul 17:37:54 - [warn] [node-red-node-sqlite/sqlite] Error: Cannot find module '/home/me/.node-red/node_modules/sqlite3/lib/binding/node-v72-linux-x64/node_sqlite3.node'
Require stack:
- /home/me/.node-red/node_modules/sqlite3/lib/sqlite3.js
- /home/me/.node-red/node_modules/node-red-node-sqlite/sqlite.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/registry/lib/loader.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/registry/lib/index.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/runtime/lib/nodes/index.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/runtime/lib/index.js
- /usr/lib/node_modules/node-red/lib/red.js
- /usr/lib/node_modules/node-red/red.js
22 Jul 17:37:54 - [warn] [node-red-contrib-play-soundfile/config-soundfile] Error: Cannot find module '/home/me/.node-red/node_modules/node-red-contrib-play-soundfile/config-soundfile.js'
Require stack:
- /usr/lib/node_modules/node-red/node_modules/@node-red/registry/lib/loader.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/registry/lib/index.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/runtime/lib/nodes/index.js
- /usr/lib/node_modules/node-red/node_modules/@node-red/runtime/lib/index.js
- /usr/lib/node_modules/node-red/lib/red.js
- /usr/lib/node_modules/node-red/red.js
22 Jul 17:37:54 - [warn] ------------------------------------------------------
22 Jul 17:37:54 - [info] Settings file  : /home/me/.node-red/settings.js
22 Jul 17:37:54 - [info] Context store  : 'default' [module=memory]
22 Jul 17:37:54 - [info] User directory : /home/me/.node-red
22 Jul 17:37:54 - [warn] Projects disabled : editorTheme.projects.enabled=false
22 Jul 17:37:54 - [info] Flows file     : /home/me/.node-red/flows.json
22 Jul 17:37:54 - [info] Creating new flow file
22 Jul 17:37:54 - [warn] 

---------------------------------------------------------------------
Your flow credentials file is encrypted using a system-generated key.

If the system-generated key is lost for any reason, your credentials
file will not be recoverable, you will have to delete it and re-enter
your credentials.

You should set your own key using the 'credentialSecret' option in
your settings file. Node-RED will then re-encrypt your credentials
file using your chosen key the next time you deploy a change.
---------------------------------------------------------------------

22 Jul 17:37:54 - [info] Server now running at http://127.0.0.1:1880/
22 Jul 17:37:54 - [info] Starting flows
22 Jul 17:37:54 - [info] Started flows

Refresh the browser (force refresh) and it says there are things needing RESOLUTION....
I click the butt and get this screen:

Bit of a worry all those FLOW DELETED messages.

what is in your settings.js file now?

/**
 * This is the default settings file provided by Node-RED.
 *
 * It can contain any valid JavaScript code that will get run when Node-RED
 * is started.
 *
 * Lines that start with // are commented out.
 * Each entry should be separated from the entries above and below by a comma ','
 *
 * For more information about individual settings, refer to the documentation:
 *    https://nodered.org/docs/user-guide/runtime/configuration
 *
 * The settings are split into the following sections:
 *  - Flow File and User Directory Settings
 *  - Security
 *  - Server Settings
 *  - Runtime Settings
 *  - Editor Settings
 *  - Node Settings
 *
 **/

module.exports = {

/*******************************************************************************
 * Flow File and User Directory Settings
 *  - flowFile
 *  - credentialSecret
 *  - flowFilePretty
 *  - userDir
 *  - nodesDir
 ******************************************************************************/

    /** The file containing the flows. If not set, defaults to flows_<hostname>.json **/
    flowFile: 'flows.json',

    /** By default, credentials are encrypted in storage using a generated key. To
     * specify your own secret, set the following property.
     * If you want to disable encryption of credentials, set this property to false.
     * Note: once you set this property, do not change it - doing so will prevent
     * node-red from being able to decrypt your existing credentials and they will be
     * lost.
     */
    //credentialSecret: "a-secret-key",

    /** By default, the flow JSON will be formatted over multiple lines making
     * it easier to compare changes when using version control.
     * To disable pretty-printing of the JSON set the following property to false.
     */
    flowFilePretty: true,

    /** By default, all user data is stored in a directory called `.node-red` under
     * the user's home directory. To use a different location, the following
     * property can be used
     */
    //userDir: '/home/nol/.node-red/',

    /** Node-RED scans the `nodes` directory in the userDir to find local node files.
     * The following property can be used to specify an additional directory to scan.
     */
    //nodesDir: '/home/nol/.node-red/nodes',

/*******************************************************************************
 * Security
 *  - adminAuth
 *  - https
 *  - httpsRefreshInterval
 *  - requireHttps
 *  - httpNodeAuth
 *  - httpStaticAuth
 ******************************************************************************/

    /** To password protect the Node-RED editor and admin API, the following
     * property can be used. See http://nodered.org/docs/security.html for details.
     */
    //adminAuth: {
    //    type: "credentials",
    //    users: [{
    //        username: "admin",
    //        password: "$2a$08$zZWtXTja0fB1pzD4sHCMyOCMYz2Z6dNbM6tl8sJogENOMcxWV9DN.",
    //        permissions: "*"
    //    }]
    //},

    /** The following property can be used to enable HTTPS
     * This property can be either an object, containing both a (private) key
     * and a (public) certificate, or a function that returns such an object.
     * See http://nodejs.org/api/https.html#https_https_createserver_options_requestlistener
     * for details of its contents.
     */

    /** Option 1: static object */
    //https: {
    //  key: require("fs").readFileSync('privkey.pem'),
    //  cert: require("fs").readFileSync('cert.pem')
    //},

    /** Option 2: function that returns the HTTP configuration object */
    // https: function() {
    //     // This function should return the options object, or a Promise
    //     // that resolves to the options object
    //     return {
    //         key: require("fs").readFileSync('privkey.pem'),
    //         cert: require("fs").readFileSync('cert.pem')
    //     }
    // },

    /** If the `https` setting is a function, the following setting can be used
     * to set how often, in hours, the function will be called. That can be used
     * to refresh any certificates.
     */
    //httpsRefreshInterval : 12,

    /** The following property can be used to cause insecure HTTP connections to
     * be redirected to HTTPS.
     */
    //requireHttps: true,

    /** To password protect the node-defined HTTP endpoints (httpNodeRoot),
     * including node-red-dashboard, or the static content (httpStatic), the
     * following properties can be used.
     * The `pass` field is a bcrypt hash of the password.
     * See http://nodered.org/docs/security.html#generating-the-password-hash
     */
    //httpNodeAuth: {user:"user",pass:"$2a$08$zZWtXTja0fB1pzD4sHCMyOCMYz2Z6dNbM6tl8sJogENOMcxWV9DN."},
    //httpStaticAuth: {user:"user",pass:"$2a$08$zZWtXTja0fB1pzD4sHCMyOCMYz2Z6dNbM6tl8sJogENOMcxWV9DN."},

/*******************************************************************************
 * Server Settings
 *  - uiPort
 *  - uiHost
 *  - apiMaxLength
 *  - httpServerOptions
 *  - httpAdminRoot
 *  - httpAdminMiddleware
 *  - httpNodeRoot
 *  - httpNodeCors
 *  - httpNodeMiddleware
 *  - httpStatic
 ******************************************************************************/

    /** the tcp port that the Node-RED web server is listening on */
    uiPort: process.env.PORT || 1880,

    /** By default, the Node-RED UI accepts connections on all IPv4 interfaces.
     * To listen on all IPv6 addresses, set uiHost to "::",
     * The following property can be used to listen on a specific interface. For
     * example, the following would only allow connections from the local machine.
     */
    //uiHost: "127.0.0.1",

    /** The maximum size of HTTP request that will be accepted by the runtime api.
     * Default: 5mb
     */
    //apiMaxLength: '5mb',

    /** The following property can be used to pass custom options to the Express.js
     * server used by Node-RED. For a full list of available options, refer
     * to http://expressjs.com/en/api.html#app.settings.table
     */
    //httpServerOptions: { },

    /** By default, the Node-RED UI is available at http://localhost:1880/
     * The following property can be used to specify a different root path.
     * If set to false, this is disabled.
     */
    //httpAdminRoot: '/admin',

    /** The following property can be used to add a custom middleware function
     * in front of all admin http routes. For example, to set custom http
     * headers. It can be a single function or an array of middleware functions.
     */
    // httpAdminMiddleware: function(req,res,next) {
    //    // Set the X-Frame-Options header to limit where the editor
    //    // can be embedded
    //    //res.set('X-Frame-Options', 'sameorigin');
    //    next();
    // },


    /** Some nodes, such as HTTP In, can be used to listen for incoming http requests.
     * By default, these are served relative to '/'. The following property
     * can be used to specifiy a different root path. If set to false, this is
     * disabled.
     */
    //httpNodeRoot: '/red-nodes',

    /** The following property can be used to configure cross-origin resource sharing
     * in the HTTP nodes.
     * See https://github.com/troygoode/node-cors#configuration-options for
     * details on its contents. The following is a basic permissive set of options:
     */
    //httpNodeCors: {
    //    origin: "*",
    //    methods: "GET,PUT,POST,DELETE"
    //},

    /** If you need to set an http proxy please set an environment variable
     * called http_proxy (or HTTP_PROXY) outside of Node-RED in the operating system.
     * For example - http_proxy=http://myproxy.com:8080
     * (Setting it here will have no effect)
     * You may also specify no_proxy (or NO_PROXY) to supply a comma separated
     * list of domains to not proxy, eg - no_proxy=.acme.co,.acme.co.uk
     */

    /** The following property can be used to add a custom middleware function
     * in front of all http in nodes. This allows custom authentication to be
     * applied to all http in nodes, or any other sort of common request processing.
     * It can be a single function or an array of middleware functions.
     */
    //httpNodeMiddleware: function(req,res,next) {
    //    // Handle/reject the request, or pass it on to the http in node by calling next();
    //    // Optionally skip our rawBodyParser by setting this to true;
    //    //req.skipRawBodyParser = true;
    //    next();
    //},

    /** When httpAdminRoot is used to move the UI to a different root path, the
     * following property can be used to identify a directory of static content
     * that should be served at http://localhost:1880/.
     */
    //httpStatic: '/home/nol/node-red-static/',

/*******************************************************************************
 * Runtime Settings
 *  - lang
 *  - logging
 *  - contextStorage
 *  - exportGlobalContextKeys
 *  - externalModules
 ******************************************************************************/

     /** Uncomment the following to run node-red in your preferred language.
      * Available languages include: en-US (default), ja, de, zh-CN, zh-TW, ru, ko
      * Some languages are more complete than others.
      */
     // lang: "de",

     /** Configure the logging output */
     logging: {
         /** Only console logging is currently supported */
         console: {
             /** Level of logging to be recorded. Options are:
              * fatal - only those errors which make the application unusable should be recorded
              * error - record errors which are deemed fatal for a particular request + fatal errors
              * warn - record problems which are non fatal + errors + fatal errors
              * info - record information about the general running of the application + warn + error + fatal errors
              * debug - record information which is more verbose than info + info + warn + error + fatal errors
              * trace - record very detailed logging + debug + info + warn + error + fatal errors
              * off - turn off all logging (doesn't affect metrics or audit)
              */
             level: "info",
             /** Whether or not to include metric events in the log output */
             metrics: false,
             /** Whether or not to include audit events in the log output */
             audit: false
         }
     },

     /** Context Storage
      * The following property can be used to enable context storage. The configuration
      * provided here will enable file-based context that flushes to disk every 30 seconds.
      * Refer to the documentation for further options: https://nodered.org/docs/api/context/
      */
     //contextStorage: {
     //    default: {
     //        module:"localfilesystem"
     //    },
     //},

     /** `global.keys()` returns a list of all properties set in global context.
      * This allows them to be displayed in the Context Sidebar within the editor.
      * In some circumstances it is not desirable to expose them to the editor. The
      * following property can be used to hide any property set in `functionGlobalContext`
      * from being list by `global.keys()`.
      * By default, the property is set to false to avoid accidental exposure of
      * their values. Setting this to true will cause the keys to be listed.
      */
     exportGlobalContextKeys: false,

     /** Configure how the runtime will handle external npm modules.
      * This covers:
      *  - whether the editor will allow new node modules to be installed
      *  - whether nodes, such as the Function node are allowed to have their
      * own dynamically configured dependencies.
      * The allow/denyList options can be used to limit what modules the runtime
      * will install/load. It can use '*' as a wildcard that matches anything.
      */
     externalModules: {
         // autoInstall: false,   /** Whether the runtime will attempt to automatically install missing modules */
         // autoInstallRetry: 30, /** Interval, in seconds, between reinstall attempts */
         // palette: {              /** Configuration for the Palette Manager */
         //     allowInstall: true, /** Enable the Palette Manager in the editor */
         //     allowUpdate: true,  /** Allow modules to be updated in the Palette Manager */
         //     allowUpload: true,  /** Allow module tgz files to be uploaded and installed */
         //     allowList: ['*'],
         //     denyList: [],
         //     allowUpdateList: ['*'],
         //     denyUpdateList: []
         // },
         // modules: {              /** Configuration for node-specified modules */
         //     allowInstall: true,
         //     allowList: [],
         //     denyList: []
         // }
     },


/*******************************************************************************
 * Editor Settings
 *  - disableEditor
 *  - editorTheme
 ******************************************************************************/

    /** The following property can be used to disable the editor. The admin API
     * is not affected by this option. To disable both the editor and the admin
     * API, use either the httpRoot or httpAdminRoot properties
     */
    //disableEditor: false,

    /** Customising the editor
     * See https://nodered.org/docs/user-guide/runtime/configuration#editor-themes
     * for all available options.
     */
    editorTheme: {
        /** The following property can be used to set a custom theme for the editor.
         * See https://github.com/node-red-contrib-themes/theme-collection for
         * a collection of themes to chose from.
         */
        //theme: "",
        palette: {
            /** The following property can be used to order the categories in the editor
             * palette. If a node's category is not in the list, the category will get
             * added to the end of the palette.
             * If not set, the following default order is used:
             */
            //categories: ['subflows', 'common', 'function', 'network', 'sequence', 'parser', 'storage'],
        },
        projects: {
            /** To enable the Projects feature, set this value to true */
            enabled: false,
            workflow: {
                /** Set the default projects workflow mode.
                 *  - manual - you must manually commit changes
                 *  - auto - changes are automatically committed
                 * This can be overridden per-user from the 'Git config'
                 * section of 'User Settings' within the editor
                 */
                mode: "manual"
            }
        },
        codeEditor: {
            /** Select the text editor component used by the editor.
             * Defaults to "ace", but can be set to "ace" or "monaco"
             */
            lib: "ace",
            options: {
                /** The follow options only apply if the editor is set to "monaco"
                 *
                 * theme - must match the file name of a theme in
                 * packages/node_modules/@node-red/editor-client/src/vendor/monaco/dist/theme
                 * e.g. "tomorrow-night", "upstream-sunburst", "github", "my-theme"
                 */
                theme: "vs",
                /** other overrides can be set e.g. fontSize, fontFamily, fontLigatures etc.
                 * for the full list, see https://microsoft.github.io/monaco-editor/api/interfaces/monaco.editor.istandaloneeditorconstructionoptions.html
                 */
                //fontSize: 14,
                //fontFamily: "Cascadia Code, Fira Code, Consolas, 'Courier New', monospace",
                //fontLigatures: true,
            }
        }
    },

/*******************************************************************************
 * Node Settings
 *  - fileWorkingDirectory
 *  - functionGlobalContext
 *  - functionExternalModules
 *  - nodeMessageBufferMaxLength
 *  - ui (for use with Node-RED Dashboard)
 *  - debugUseColors
 *  - debugMaxLength
 *  - execMaxBufferSize
 *  - httpRequestTimeout
 *  - mqttReconnectTime
 *  - serialReconnectTime
 *  - socketReconnectTime
 *  - socketTimeout
 *  - tcpMsgQueueSize
 *  - inboundWebSocketTimeout
 *  - tlsConfigDisableLocalFiles
 *  - webSocketNodeVerifyClient
 ******************************************************************************/

    /** The working directory to handle relative file paths from within the File nodes
     * defaults to the working directory of the Node-RED process.
     */
    //fileWorkingDirectory: "",

    /** Allow the Function node to load additional npm modules directly */
    functionExternalModules: true,

    /** The following property can be used to set predefined values in Global Context.
     * This allows extra node modules to be made available with in Function node.
     * For example, the following:
     *    functionGlobalContext: { os:require('os') }
     * will allow the `os` module to be accessed in a Function node using:
     *    global.get("os")
     */
    functionGlobalContext: {
        // os:require('os'),
    },

    /** The maximum number of messages nodes will buffer internally as part of their
     * operation. This applies across a range of nodes that operate on message sequences.
     * defaults to no limit. A value of 0 also means no limit is applied.
     */
    //nodeMessageBufferMaxLength: 0,

    /** If you installed the optional node-red-dashboard you can set it's path
     * relative to httpNodeRoot
     * Other optional properties include
     *  readOnly:{boolean},
     *  middleware:{function or array}, (req,res,next) - http middleware
     *  ioMiddleware:{function or array}, (socket,next) - socket.io middleware
     */
    //ui: { path: "ui" },

    /** Colourise the console output of the debug node */
    //debugUseColors: true,

    /** The maximum length, in characters, of any message sent to the debug sidebar tab */
    debugMaxLength: 1000,

    /** Maximum buffer size for the exec node. Defaults to 10Mb */
    //execMaxBufferSize: 10000000,

    /** Timeout in milliseconds for HTTP request connections. Defaults to 120s */
    //httpRequestTimeout: 120000,

    /** Retry time in milliseconds for MQTT connections */
    mqttReconnectTime: 15000,

    /** Retry time in milliseconds for Serial port connections */
    serialReconnectTime: 15000,

    /** Retry time in milliseconds for TCP socket connections */
    //socketReconnectTime: 10000,

    /** Timeout in milliseconds for TCP server socket connections. Defaults to no timeout */
    //socketTimeout: 120000,

    /** Maximum number of messages to wait in queue while attempting to connect to TCP socket
     * defaults to 1000
     */
    //tcpMsgQueueSize: 2000,

    /** Timeout in milliseconds for inbound WebSocket connections that do not
     * match any configured node. Defaults to 5000
     */
    //inboundWebSocketTimeout: 5000,

    /** To disable the option for using local files for storing keys and
     * certificates in the TLS configuration node, set this to true.
     */
    //tlsConfigDisableLocalFiles: true,

    /** The following property can be used to verify websocket connection attempts.
     * This allows, for example, the HTTP request headers to be checked to ensure
     * they include valid authentication information.
     */
    //webSocketNodeVerifyClient: function(info) {
    //    /** 'info' has three properties:
    //    *   - origin : the value in the Origin header
    //    *   - req : the HTTP request
    //    *   - secure : true if req.connection.authorized or req.connection.encrypted is set
    //    *
    //    * The function should return true if the connection should be accepted, false otherwise.
    //    *
    //    * Alternatively, if this function is defined to accept a second argument, callback,
    //    * it can be used to verify the client asynchronously.
    //    * The callback takes three arguments:
    //    *   - result : boolean, whether to accept the connection or not
    //    *   - code : if result is false, the HTTP error status to return
    //    *   - reason: if result is false, the HTTP reason string to return
    //    */
    //},
}

I think I will have to setup the public path - etc.

Yes, you will need to restore any modified settings you used to have (like pointing to your original flows file - the line flowFile: 'flows.json', can be changed to something like flowFile: 'flows_pi.json', or whatever your old/original flow file was). Also, you will need to re-add any httpStatic you had set in old settings file.

Lastly, as you can see, this time it has worked - you now have a new (up to date) settings file - now you just need to modify the line lib: "ace", to lib: "monaco",

Good news/bad news.... (Mostly bad)

I did the node-red and got things back to being visible.
So then I flipped back to the CLI and ^c.

When I went back to Node-red, it had stopped. (I wonder why).
So I did node-red again.
Now when node-red page loads it is blank and all flows lost. (at this instance)

WRT the "old files"... I never changed that part.
As far as I know flow.file is flows.json..... (This is on ubuntu at this stage)

So I'm confused why it is lost.

what does ls -a show (in your .node-red directory)

me@me-desktop:~/.node-red$ ls -a
.                    .config.nodes.json         cronplusdata                        flows_me-desktop.json          node_modules       temp
..                   .config.nodes.json.backup  .flows_me-desktop_cred.json         .flows_me-desktop.json.backup  npm_modules.txt    uibuilder
certificates         .config.projects.json      flows_me-desktop_cred.json          .flows_me-desktop.json-BACKUP  package.json
.config.json         .config.runtime.json       .flows_me-desktop_cred.json.backup  JsonDB                         package-lock.json
.config.json.backup  .config.users.json         .flows_me-desktop_cred.json-BACKUP  lib                            public
.config.json-BACKUP  .config.users.json.backup  .flows_me-desktop.json              myjs                           settings.js
me@me-desktop:~/.node-red$ 

So I'm guessing flows_me-desktop.json

So (sorry) how do I get node-red to import that?
Just it seems weird as that is the file to which it writes anyway.

just how i said...

In your case change flowFile: 'flows.json', to flowFile: 'flows_me-desktop.json', then restart node-red

Ok, I will change it to that, but it is confusing.

I have the line in the config as:
flowFile: 'flows.json', (line 35)
So why/how is it (node-red) saving files as flows_me-desktop.json?

(Sorry)

As I have only done the node-red and not node-red-start.... I can't it can I.
Cos' then node-red will stop.

I think recommending a user just deletes their settings file without saying up front they need to restore all the changes they may have made is a recipe for disaster. For example, we changed the default flowFile setting - so this will break users... as we're seeing here.

@Trying_to_learn did you keep a copy of your settings.js file? Or did you delete it as suggested?