{"id":12204,"library":"tui-code-snippet","title":"TOAST UI Code Snippet","description":"TOAST UI Code Snippet (tui-code-snippet) is a comprehensive collection of modular, lightweight utility methods designed to simplify common JavaScript programming tasks. Currently stable at version 2.3.3, the library maintains a steady release cadence with regular updates including bug fixes and new features, such as the `ajax` module introduced in v2.3.0. A key differentiator since its 2.0 major release is its transition to a fully modular architecture, requiring developers to import individual functions or modules (e.g., `tui-code-snippet/array/inArray`) rather than a monolithic bundle. This approach minimizes bundle sizes by ensuring only the necessary utilities are included in an application. It provides functionalities across various domains including array manipulation, browser detection, collection processing, custom event management, DOM manipulation, class definition, date formatting, inheritance patterns, object utilities, and type checking. It explicitly supports both ES6 module syntax and CommonJS `require` patterns, making it versatile for modern JavaScript development environments. The library is a foundational component within the broader NHN TOAST UI ecosystem.","status":"active","version":"2.3.3","language":"javascript","source_language":"en","source_url":"https://github.com/nhn/tui.code-snippet","tags":["javascript","nhn","tui","utility","code-snippet"],"install":[{"cmd":"npm install tui-code-snippet","lang":"bash","label":"npm"},{"cmd":"yarn add tui-code-snippet","lang":"bash","label":"yarn"},{"cmd":"pnpm add tui-code-snippet","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"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.","wrong":"import { inArray } from 'tui-code-snippet';","symbol":"inArray","correct":"import inArray from 'tui-code-snippet/array/inArray';"},{"note":"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.","wrong":"const tui = require('tui-code-snippet');\nconst isString = tui.type.isString;","symbol":"isString","correct":"const isString = require('tui-code-snippet/type/isString');"},{"note":"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.","wrong":"import { ajax } from 'tui-code-snippet';","symbol":"ajax","correct":"import ajax from 'tui-code-snippet/ajax/index';"}],"quickstart":{"code":"import inArray from 'tui-code-snippet/array/inArray';\nimport isString from 'tui-code-snippet/type/isString';\nimport decodeHTMLEntity from 'tui-code-snippet/string/decodeHTMLEntity';\nimport extend from 'tui-code-snippet/object/extend';\n\nconsole.log('--- TOAST UI Code Snippet Quickstart ---');\n\n// Example 1: Check if an item is in an array\nconst myArray = [1, 2, 3, 4, 5];\nconst searchTerm = 3;\nconsole.log(`Is ${searchTerm} in [${myArray}]? ${inArray(searchTerm, myArray)}`);\n\nconst notFoundTerm = 6;\nconsole.log(`Is ${notFoundTerm} in [${myArray}]? ${inArray(notFoundTerm, myArray)}`);\n\n// Example 2: Check data type\nconst myString = \"Hello, world!\";\nconst myNumber = 123;\nconsole.log(`\"${myString}\" is a string? ${isString(myString)}`);\nconsole.log(`${myNumber} is a string? ${isString(myNumber)}`);\n\n// Example 3: Decode HTML entities\nconst encodedHtml = \"<div>Hello & World!</div>\";\nconst decodedHtml = decodeHTMLEntity(encodedHtml);\nconsole.log(`Decoded HTML: ${decodedHtml}`);\n\n// Example 4: Extend an object\nconst obj1 = { a: 1, b: 2 };\nconst obj2 = { b: 3, c: 4 };\nconst extendedObj = extend({}, obj1, obj2);\nconsole.log('Extended object:', extendedObj);\n\nconsole.log('------------------------------------');","lang":"javascript","description":"Demonstrates importing and using several core utility functions like `inArray`, `isString`, `decodeHTMLEntity`, and `extend` for array, type, string, and object manipulation, respectively."},"warnings":[{"fix":"Migrate your project to use npm for package management. Install with `npm install --save tui-code-snippet`.","message":"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`.","severity":"breaking","affected_versions":">=2.0.0"},{"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.","message":"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';`).","severity":"breaking","affected_versions":">=2.0.0"},{"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.","message":"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.","severity":"gotcha","affected_versions":">=2.1.0"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"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.","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.","error":"TypeError: Cannot read properties of undefined (reading 'inArray') OR TypeError: Cannot read property 'inArray' of undefined"},{"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.","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.","error":"Module not found: Error: Can't resolve 'tui-code-snippet'"}],"ecosystem":"npm"}