Error: ENOENT: no such file or directory, open ‘D:d%3AVSCodeExtfunindex.html’

I do see similar questions but no actual answer. The problem with mine it keeps adding a d%3A on the path. I don’t know why it is doing that. I feel if it wouldn’t do that I can finish my extension. Yes I was working from it with a tutorial but I can’t figure out the path situation. I know other questions are out there but their’s are actually different.

my extension.js

// The module 'vscode' contains the VS Code extensibility API
// Import the module and reference it with the alias vscode in your code below
const vscode = require('vscode');
const fs = require('fs');
const path = require('path')

// this method is called when your extension is activated
// your extension is activated the very first time the command is executed

/**
 * @param {vscode.ExtensionContext} context
 */
function activate(context) {

    // Use the console to output diagnostic information (console.log) and errors (console.error)
    // This line of code will only be executed once when your extension is activated
    console.log('Congratulations, your extension "alsbp" is now active!');

    // The command has been defined in the package.json file
    // Now provide the implementation of the command with  registerCommand
    // The commandId parameter must match the command field in package.json
    let disposable = vscode.commands.registerCommand(
        'alsbp.createBoilerPlate', 
        function () {
            const htmlContent = `
            <!DOCTYPE html>
            <html lang="en">
            <head>
                <meta charset="UTF-8">
                <meta http-equiv="X-UA-Compatible" content="IE=edge">
                <meta name="viewport" content="width=device-width, initial-scale=1.0">
                <title>Your Title</title>
                <link rel="stylesheet" href="./app.css">
            </head>
            <body>
            <script src="./app.js"></script>
            </body>
            </html>
            `;
        
        const folderPath = vscode.workspace.workspaceFolders[0].uri.toString().split(":")[1];
            console.log(folderPath)
        fs.writeFile(path.join(folderPath, "index.html"), htmlContent, err =>{
            if(err){
                console.error(err);
                return vscode.window.showErrorMessage("Failed dude just failed")
            };
            vscode.window.showInformationMessage("Created boiler plate")
        }
        );
    });

    context.subscriptions.push(disposable);
}

// this method is called when your extension is deactivated
function deactivate() {}

module.exports = {
    activate,
    deactivate
}

JavaScript
​x
 
// The module 'vscode' contains the VS Code extensibility API
// Import the module and reference it with the alias vscode in your code below
const vscode = require('vscode');
const fs = require('fs');
const path = require('path')
​
// this method is called when your extension is activated
// your extension is activated the very first time the command is executed
​
/**
 * @param {vscode.ExtensionContext} context
 */
function activate(context) {
​
    // Use the console to output diagnostic information (console.log) and errors (console.error)
    // This line of code will only be executed once when your extension is activated
    console.log('Congratulations, your extension "alsbp" is now active!');
​
    // The command has been defined in the package.json file
    // Now provide the implementation of the command with  registerCommand
    // The commandId parameter must match the command field in package.json
    let disposable = vscode.commands.registerCommand(
        'alsbp.createBoilerPlate', 
        function () {
            const htmlContent = `
            <!DOCTYPE html>
            <html lang="en">
            <head>
                <meta charset="UTF-8">
                <meta http-equiv="X-UA-Compatible" content="IE=edge">
                <meta name="viewport" content="width=device-width, initial-scale=1.0">
                <title>Your Title</title>
                <link rel="stylesheet" href="./app.css">
            </head>
            <body>
            <script src="./app.js"></script>
            </body>
            </html>
            `;
        
        const folderPath = vscode.workspace.workspaceFolders[0].uri.toString().split(":")[1];
            console.log(folderPath)
        fs.writeFile(path.join(folderPath, "index.html"), htmlContent, err =>{
            if(err){
                console.error(err);
                return vscode.window.showErrorMessage("Failed dude just failed")
            };
            vscode.window.showInformationMessage("Created boiler plate")
        }
        );
    });
​
    context.subscriptions.push(disposable);
}
​
// this method is called when your extension is deactivated
function deactivate() {}
​
module.exports = {
    activate,
    deactivate
}
​

package.json

{
    "name": "alsbp",
    "displayName": "AlsBoilerPlates",
    "description": "generate a html js and css file and have the emmet link app.js and css file",
    "version": "0.0.1",
    "engines": {
        "vscode": "^1.58.0"
    },
    "categories": [
        "Other"
    ],
    "activationEvents": [
        "onCommand:alsbp.createBoilerPlate"
    ],
    "main": "./extension.js",
    "contributes": {
        "commands": [
            {
                "command": "alsbp.createBoilerPlate",
                "title": "Create Al's Boiler Plates"
            }
        ]
    },
    "scripts": {
        "lint": "eslint .",
        "pretest": "npm run lint",
        "test": "node ./test/runTest.js"
    },
    "devDependencies": {
        "@types/vscode": "^1.58.0",
        "@types/glob": "^7.1.3",
        "@types/mocha": "^8.2.2",
        "@types/node": "14.x",
        "eslint": "^7.27.0",
        "glob": "^7.1.7",
        "mocha": "^8.4.0",
        "typescript": "^4.3.2",
        "vscode-test": "^1.5.2"
    }
}

JavaScript
 
{
    "name": "alsbp",
    "displayName": "AlsBoilerPlates",
    "description": "generate a html js and css file and have the emmet link app.js and css file",
    "version": "0.0.1",
    "engines": {
        "vscode": "^1.58.0"
    },
    "categories": [
        "Other"
    ],
    "activationEvents": [
        "onCommand:alsbp.createBoilerPlate"
    ],
    "main": "./extension.js",
    "contributes": {
        "commands": [
            {
                "command": "alsbp.createBoilerPlate",
                "title": "Create Al's Boiler Plates"
            }
        ]
    },
    "scripts": {
        "lint": "eslint .",
        "pretest": "npm run lint",
        "test": "node ./test/runTest.js"
    },
    "devDependencies": {
        "@types/vscode": "^1.58.0",
        "@types/glob": "^7.1.3",
        "@types/mocha": "^8.2.2",
        "@types/node": "14.x",
        "eslint": "^7.27.0",
        "glob": "^7.1.7",
        "mocha": "^8.4.0",
        "typescript": "^4.3.2",
        "vscode-test": "^1.5.2"
    }
}
​
​

Answer

I had to look at the path:

I had this originally

const folderPath = vscode.workspace.workspaceFolders[0].uri.toString().split(":")[1];

JavaScript
 
const folderPath = vscode.workspace.workspaceFolders[0].uri.toString().split(":")[1];
​

and changed it to this

const folderPath = vscode.workspace.workspaceFolders[0].uri['fsPath']

JavaScript
 
const folderPath = vscode.workspace.workspaceFolders[0].uri['fsPath']
​

I forgot about being able to use the [] because of mapping etc..

Advertisement

Answer