Policy restrictions on running scripts in Windows

vue --version
+ ~~~
+ CategoryInfo : SecurityError: (:) [], PSSecurityException
+ FullyQualifiedErrorId : UnauthorizedAccess

Open PowerShell with administrator privileges:

Search for "PowerShell" in the Windows search bar
Right-click on "Windows PowerShell" and select "Run as administrator"
Run the following command in PowerShell to change the script execution policy:
𝑃PowerShell
Set-ExecutionPolicy -ExecutionPolicy Unrestricted -Scope CurrentUser

After running this command, you can try running the vue --version command again and you should be able to see the installed version of the Vue CLI.

If the issue persists even after this, you can try using a different shell environment, such as Git Bash or Windows Terminal, to run the Vue CLI commands.

Node.js 17.0.1 Gatsby error - "digital envelope routines::unsupported ... ERR_OSSL_EVP_UNSUPPORTED"

I am building a Gatsby site. I upgraded Node.js to v17.0.1, and when I run a build, there is an error:

Error: digital envelope routines::unsupported

opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
library: 'digital envelope routines',
reason: 'unsupported',
code: 'ERR_OSSL_EVP_UNSUPPORTED'

If I downgrade it to v16, it works fine, and the build will be successful. How can I fix this?

---

This might help. Add these scripts in the package.json file.

React:

"scripts": {
    "start": "export SET NODE_OPTIONS=--openssl-legacy-provider && react-scripts start",
    "build": "export SET NODE_OPTIONS=--openssl-legacy-provider && react-scripts build"
}

or

"scripts": {
    "start": "react-scripts --openssl-legacy-provider start",
    "build": "react-scripts --openssl-legacy-provider build",
}

Vue.js:

"scripts": {
    "serve": "export NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",
    "build": "export NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build",
    "lint": "export NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service lint"
},

or

"scripts": {
    "serve": "vue-cli-service --openssl-legacy-provider serve",
    "build": "vue-cli-service --openssl-legacy-provider build",
    "lint": "vue-cli-service --openssl-legacy-provider lint"
},

---

this work for me:

"scripts": {

"serve": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",

"build": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build",

"lint": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service lint"

},

Vue.Js Trim String JavaScript Example

new Vue({

el: '#app',
  
  data: function() {
  	return {
    	text: ' This is string having space at both side. '
    }
  },
  
  filters: {
  
  	trim: function(string) {
    	return string.trim()
        }
  
  }

});
//Usage 

{{ text | trim }}