TOAST UI Code Snippet

Common errors

• TypeError: Cannot read properties of undefined (reading 'inArray') OR TypeError: Cannot read property 'inArray' of undefined

  cause Attempting to access utility functions from a top-level 'tui' or 'util' object after importing the main package, which is no longer supported since v2.0. You are likely importing `tui-code-snippet` monolithically instead of individual functions.
  fix Ensure you are importing individual functions from their specific file paths (e.g., `import inArray from 'tui-code-snippet/array/inArray';`). Do not try to access `tui.array.inArray` or similar patterns.

• Module not found: Error: Can't resolve 'tui-code-snippet'

  cause This error can occur if you're trying to import the root package directly as a main entry point for specific functions without a bundler correctly resolving it, or if you're trying to access a sub-path that doesn't exist. It can also happen if `tui-code-snippet` is not correctly installed via npm or if you migrated from older versions (pre-v2.0) and retained CDN/Bower references.
  fix Verify that `tui-code-snippet` is installed in your `node_modules`. If using a bundler (like Webpack/Rollup), ensure your imports point to the exact module files (e.g., `tui-code-snippet/array/inArray`). Ensure you're not trying to import a non-existent bundle file.

Warnings

• breaking Version 2.0 introduced significant breaking changes by moving to an npm-only distribution model. Bower and CDN support were dropped, requiring installation via `npm`.
  Fix: Migrate your project to use npm for package management. Install with `npm install --save tui-code-snippet`.
• breaking Since v2.0, all functions are separated into individual files. You can no longer import a single 'tui-code-snippet' object and access utilities like `tui.array.inArray`. Each function must be imported explicitly from its specific module path (e.g., `import inArray from 'tui-code-snippet/array/inArray';`).
  Fix: Update all import statements to target the specific utility function's module path. Refer to the project's GitHub repository for the folder structure to find correct paths.
• gotcha From v2.1.0 onwards, the package no longer provides pre-built bundle files. If your project requires a bundled version (e.g., for direct browser inclusion without a module bundler), you must generate it yourself.
  Fix: To create a bundle, use the command `npm run bundle` after installing the package. This will generate the necessary bundled files in your project.

Install

• npm install tui-code-snippet npm
• yarn add tui-code-snippet yarn
• pnpm add tui-code-snippet pnpm

Imports

• inArray
  wrong:

  import { inArray } from 'tui-code-snippet';

  correct:

  import inArray from 'tui-code-snippet/array/inArray';

  Since v2.0, functions must be imported individually from their specific module paths, not as named exports from the root package. Each utility function is typically a default export from its module file.
• isString
  wrong:

  const tui = require('tui-code-snippet');
  const isString = tui.type.isString;

  correct:

  const isString = require('tui-code-snippet/type/isString');

  CommonJS imports also follow the individual module path pattern since v2.0. The monolithic 'tui-code-snippet' object containing all utilities is no longer available.
• ajax
  wrong:

  import { ajax } from 'tui-code-snippet';

  correct:

  import ajax from 'tui-code-snippet/ajax/index';

  Modules like 'ajax' (introduced in v2.3.0) are typically default-exported from an 'index' file within their respective directories. Always refer to the specific module path.

Quickstart

Demonstrates importing and using several core utility functions like `inArray`, `isString`, `decodeHTMLEntity`, and `extend` for array, type, string, and object manipulation, respectively.

import inArray from 'tui-code-snippet/array/inArray';
import isString from 'tui-code-snippet/type/isString';
import decodeHTMLEntity from 'tui-code-snippet/string/decodeHTMLEntity';
import extend from 'tui-code-snippet/object/extend';

console.log('--- TOAST UI Code Snippet Quickstart ---');

// Example 1: Check if an item is in an array
const myArray = [1, 2, 3, 4, 5];
const searchTerm = 3;
console.log(`Is ${searchTerm} in [${myArray}]? ${inArray(searchTerm, myArray)}`);

const notFoundTerm = 6;
console.log(`Is ${notFoundTerm} in [${myArray}]? ${inArray(notFoundTerm, myArray)}`);

// Example 2: Check data type
const myString = "Hello, world!";
const myNumber = 123;
console.log(`"${myString}" is a string? ${isString(myString)}`);
console.log(`${myNumber} is a string? ${isString(myNumber)}`);

// Example 3: Decode HTML entities
const encodedHtml = "<div>Hello & World!</div>";
const decodedHtml = decodeHTMLEntity(encodedHtml);
console.log(`Decoded HTML: ${decodedHtml}`);

// Example 4: Extend an object
const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };
const extendedObj = extend({}, obj1, obj2);
console.log('Extended object:', extendedObj);

console.log('------------------------------------');