{"componentChunkName":"component---src-pages-get-started-develop-angular-mdx","path":"/get-started/develop/angular/","result":{"pageContext":{"isCreatedByStatefulCreatePages":true,"frontmatter":{"title":"Develop","description":"The Carbon Design System supports vanilla JS, React and Angular as core parts of the product. But you can still build components even if you're using a different framework.","tabs":["React","Vanilla","Angular","Vue","Other frameworks"]},"relativePagePath":"/get-started/develop/angular.mdx","titleType":"prepend","MdxNode":{"id":"14eb7542-8639-5843-b81a-bd7ac44084e7","children":[],"parent":"257b1415-74cd-5526-ad6b-b7a73ef878c8","internal":{"content":"---\ntitle: Develop\ndescription: The Carbon Design System supports vanilla JS, React and Angular as core parts of the product. But you can still build components even if you're using a different framework.\ntabs: ['React', 'Vanilla', 'Angular', 'Vue', 'Other frameworks']\n---\n\n\n\nCarbon Angular library\nInstall\nDevelopment\n\n\n\n## Resources\n\n\n \n \n \n \n \n
\n\n## Carbon Angular library\n\nThe [library](http://angular.carbondesignsystem.com/) provides front-end developers & engineers a collection of reusable Angular components to build websites and user interfaces. Adopting the library enables developers to use consistent markup, styles, and behavior in prototype and production work.\n\n## Install\n\nAssuming we're starting with a new @angular/cli project:\n\n```sh\n$ npx @angular/cli new my-project --style=scss\n$ cd my-project\n$ npm i --save carbon-components-angular carbon-components\n```\n\nThen we need to include carbon-components in `src/styles.scss`:\n\n```scss\n@import '~carbon-components/scss/globals/scss/styles.scss';\n```\n\nThat's it! Now start the server and start building.\n\n```sh\n$ npm start\n```\n\n_Note: This isn't the only way to bootstrap a_ `carbon-components-angular` _application, but the combination of_ `@angular/cli` _and the_ `carbon-components` _scss is our recommended setup._\n\n### Using our starter app\n\n\n\nWe recommend using the [carbon-angular-starter](https://github.com/carbon-design-system/carbon-angular-starter) for bootstrapping applications with Carbon components. Within five minutes your app will be running with the following already configured:\n\n- Angular-cli\n- Build process\n- Code styles and editor configs\n- Folder structure\n- Lazy loading\n- Routing\n- Service workers\n- Test framework\n\nCheck out the [readme](https://github.com/carbon-design-system/carbon-angular-starter) for installation instructions.\n\n## Development\n\nPlease refer to the [contributing guidelines](https://github.com/IBM/carbon-components-angular/blob/master/README.md#contributing) before starting any work.\n","type":"Mdx","contentDigest":"1ded819ef048f2bbebb54a470f430fde","counter":1451,"owner":"gatsby-plugin-mdx"},"frontmatter":{"title":"Develop","description":"The Carbon Design System supports vanilla JS, React and Angular as core parts of the product. But you can still build components even if you're using a different framework.","tabs":["React","Vanilla","Angular","Vue","Other frameworks"]},"exports":{},"rawBody":"---\ntitle: Develop\ndescription: The Carbon Design System supports vanilla JS, React and Angular as core parts of the product. But you can still build components even if you're using a different framework.\ntabs: ['React', 'Vanilla', 'Angular', 'Vue', 'Other frameworks']\n---\n\n\n\nCarbon Angular library\nInstall\nDevelopment\n\n\n\n## Resources\n\n\n \n \n \n \n \n
\n\n## Carbon Angular library\n\nThe [library](http://angular.carbondesignsystem.com/) provides front-end developers & engineers a collection of reusable Angular components to build websites and user interfaces. Adopting the library enables developers to use consistent markup, styles, and behavior in prototype and production work.\n\n## Install\n\nAssuming we're starting with a new @angular/cli project:\n\n```sh\n$ npx @angular/cli new my-project --style=scss\n$ cd my-project\n$ npm i --save carbon-components-angular carbon-components\n```\n\nThen we need to include carbon-components in `src/styles.scss`:\n\n```scss\n@import '~carbon-components/scss/globals/scss/styles.scss';\n```\n\nThat's it! Now start the server and start building.\n\n```sh\n$ npm start\n```\n\n_Note: This isn't the only way to bootstrap a_ `carbon-components-angular` _application, but the combination of_ `@angular/cli` _and the_ `carbon-components` _scss is our recommended setup._\n\n### Using our starter app\n\n\n\nWe recommend using the [carbon-angular-starter](https://github.com/carbon-design-system/carbon-angular-starter) for bootstrapping applications with Carbon components. Within five minutes your app will be running with the following already configured:\n\n- Angular-cli\n- Build process\n- Code styles and editor configs\n- Folder structure\n- Lazy loading\n- Routing\n- Service workers\n- Test framework\n\nCheck out the [readme](https://github.com/carbon-design-system/carbon-angular-starter) for installation instructions.\n\n## Development\n\nPlease refer to the [contributing guidelines](https://github.com/IBM/carbon-components-angular/blob/master/README.md#contributing) before starting any work.\n","fileAbsolutePath":"/zeit/3eb073a4/src/pages/get-started/develop/angular.mdx"}}}}