How to use the upath.basename function in upath

async function copyMandatoryFiles () {
  const buildDir = createAndGetBuildFolder()

  for (const f of assetsToCopy) {
    const filepath = path.resolve(f)

    // Get filename and dirname from the provided path.
    const filename = path.basename(filepath)
    const dirname = path.basename(path.dirname(filepath))

    // Create the directory for this file if needed.
    // ie. css/master.css needs a `css` directory.
    const targetDir = path.join(buildDir, dirname)
    sfs.createDir(targetDir)

    // And copy the file.
    const targetPath = path.join(targetDir, filename)

    console.log('- ' + targetPath)
    try {
      await writeFilePromised(targetPath, await readFilePromised(filepath))
    } catch (e) {
      const msg = chalk.dim(`(${e.message})`)
      console.error(`There was an error while copying ${chalk.bold(filename)}. ${msg}`)
    }

css: cleanResult.styles
        };

        if (this.variables.sourceMap && postcssResult.map && cleanResult.sourceMap) {
            const sm3: RawSourceMap = cleanResult.sourceMap.toJSON();
            sm3.sources[0] = '/(intermediate)/(postcss-output).css';
            sm3.file = upath.basename(cssOutputPath);

            // console.log(sm3.sources);
            // console.log(sm3.file);

            result.map = mergeSourceMap(postcssResult.map, sm3);
            // console.log(result.map.sources);
            // console.log(result.map.file);

            const sourceMapFileName = upath.basename(cssOutputPath) + '.map';
            result.css += `\n/*# sourceMappingURL=${sourceMapFileName} */`;
        }

        return result;
    }

const cleanResult = new CleanCSS(cleanCssOptions).minify(postcssResult.css);
        const errors: Error[] = cleanResult.errors;
        if (errors.length) {
            const errorMessage = "Error when minifying CSS:\n" + errors.map(Q => '- ' + Q.toString()).join("\n");
            throw new Error(errorMessage);
        }

        const result: CssBuildResult = {
            css: cleanResult.styles
        };

        if (this.variables.sourceMap && postcssResult.map && cleanResult.sourceMap) {
            const sm3: RawSourceMap = cleanResult.sourceMap.toJSON();
            sm3.sources[0] = '/(intermediate)/(postcss-output).css';
            sm3.file = upath.basename(cssOutputPath);

            // console.log(sm3.sources);
            // console.log(sm3.file);

            result.map = mergeSourceMap(postcssResult.map, sm3);
            // console.log(result.map.sources);
            // console.log(result.map.file);

            const sourceMapFileName = upath.basename(cssOutputPath) + '.map';
            result.css += `\n/*# sourceMappingURL=${sourceMapFileName} */`;
        }

        return result;
    }

function getPageFolder (buildFolder, dataFilePath, pageType) {
  // Logic:
  // - Company page should be placed in the root folder.
  // - But each product page is a subfolder.

  // If it's not a company page, it means that the page is in a subfolder.
  if (pageType !== 'company') {
    const productFolderName = path.basename(path.dirname(dataFilePath))
    const subfolder = path.join(buildFolder, productFolderName)
    return subfolder
  }

  // Company's page? It's simply the build folder!
  return buildFolder
}

const dontCompile = function(pathName) {
  // Baby Tolk wont compile files that begin with an underscore `_`.
  // This is by convention.
  const baseName = Path.basename(pathName);
  return baseName[0] === '_';
};

export async function sassImport(source: string, request: string): Promise {
    // https://github.com/ryanelian/instapack/issues/99
    // source               :   "E:/VS/MyProject/client/css/index.scss"
    // request / @import    :   "@ryan/something"

    const lookupStartPath = upath.dirname(source);        // E:/VS/MyProject/client/css/
    const requestFileName = upath.basename(request);      // something
    const requestDir = upath.dirname(request);            // @ryan/

    if (requestFileName.startsWith('_') === false) {
        const partialFolderLookups = [lookupStartPath];
        if (requestDir !== '.') {
            // upath.dirname('test') === '.'
            // upath.dirname('test/') === '.' && upath.basename('test/') === 'test'
            // @import 'test' must not be resolved into /node_modules/_test.scss
            partialFolderLookups.push('node_modules');
        }

        const partialSassResolver = ResolverFactory.createResolver({
            fileSystem: fs,
            extensions: ['.scss'],
            modules: partialFolderLookups,
            mainFiles: [],

const pathToId = file => {
  return path.basename(file).replace(/[^a-zA-Z0-9_]/g, '_')
}

sourceMap: this.variables.sourceMap,
            sourceMapInlineSources: this.variables.sourceMap
        };
        const cleanResult = new CleanCSS(cleanCssOptions).minify(postcssResult.css);
        const errors = cleanResult.errors;
        if (errors.length) {
            const errorMessage = "Error when minifying CSS:\n" + errors.map(Q => '- ' + Q.toString()).join("\n");
            throw new Error(errorMessage);
        }
        const result = {
            css: cleanResult.styles
        };
        if (this.variables.sourceMap && postcssResult.map && cleanResult.sourceMap) {
            const sm3 = cleanResult.sourceMap.toJSON();
            sm3.sources[0] = '/(intermediate)/(postcss-output).css';
            sm3.file = upath.basename(cssOutputPath);
            result.map = mergeSourceMap(postcssResult.map, sm3);
            const sourceMapFileName = upath.basename(cssOutputPath) + '.map';
            result.css += `\n/*# sourceMappingURL=${sourceMapFileName} */`;
        }
        return result;
    }
    build() {

fixSassGeneratedSourceMap(sm: RawSourceMap): void {
        const folder = upath.basename(this.virtualSassOutputFilePath);
        sm.sources = sm.sources.map(s => {
            const absolute = upath.join(folder, s);
            return '/' + upath.relative(this.finder.root, absolute);
        });
    }