- \n
- don’t select the one with (json) at the end<\/li>\n<\/ul>\n<\/li>\n\n\n\n
- In Search Settings<\/em> box type in files.associations<\/strong><\/li>\n\n\n\n
- YOu should see an area titled Files: Associations<\/li>\n\n\n\n
- Click the Add Item <\/strong>button<\/li>\n\n\n\n
- There is space to put in a item and a value. Type in the following (note that the * asterisk in front of the item is important\n
- \n
- item: *.njk<\/strong> value: html<\/strong> then click OK<\/li>\n\n\n\n
- item: *.md<\/strong> value: html<\/strong> then click OK<\/li>\n\n\n\n
![\"\"](\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Screenshot-2023-03-09-at-5.28.16-PM.png\")
<\/li>\n<\/ul>\n<\/li>\n\n\n\n- This will now have VS Code see all Nunjucks (.njk) and all Markdown (.md) files as HTML and allow you to use Emmet.<\/li>\n<\/ol>\n\n\n\n
![\"\"](\"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-content\/uploads\/sites\/2916\/2023\/03\/Screenshot-2023-03-09-at-5.22.51-PM-1024x396.png\")
Files: Associations settings after associating nunjucks and Markdown files with HTML.<\/figcaption><\/figure>\n\n\n\n Extensions<\/h2>\n\n\n\n
Extensions add abilities to VS Code. On order to make our work with VS Code Easier I recommend the following extensions:<\/p>\n\n\n\n
- \n
- GitLens<\/li>\n\n\n\n
- Nunjucks<\/li>\n\n\n\n
- Live Server (only on the first project. We do not need this when working with Eleventy)<\/li>\n\n\n\n
- Prettier<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"
Setup When we’re working with Eleventy, we will use Markdown and Nunjucks files. Markdown files have their own syntax but you can also use normal HTLM. Nunjucks are template files and we will mostly be writing HTML with some of the Nunjucks template syntax as well. However VS Code will not recognize these as HTML… Continue reading VS Code Setup and Extensions<\/span><\/a><\/p>\n","protected":false},"author":16,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_uag_custom_page_level_css":"","portfolio_post_id":0,"portfolio_citation":"","portfolio_annotation":"","openlab_post_visibility":"","footnotes":""},"categories":[136],"tags":[54,218,219,135],"coauthors":[87],"class_list":["post-2705","post","type-post","status-publish","format-standard","hentry","category-tools","tag-eleventy","tag-markdown","tag-settings","tag-vs-code","entry"],"featured_image_urls_v2":{"full":"","thumbnail":"","medium":"","medium_large":"","large":"","1536x1536":"","2048x2048":"","post-thumbnail":"","gform-image-choice-sm":"","gform-image-choice-md":"","gform-image-choice-lg":""},"post_excerpt_stackable_v2":"
Setup When we’re working with Eleventy, we will use Markdown and Nunjucks files. Markdown files have their own syntax but you can also use normal HTLM. Nunjucks are template files and we will mostly be writing HTML with some of the Nunjucks template syntax as well. However VS Code will not recognize these as HTML files either. To be able to use Emmet with both we will change the settings. Type Shift+Command+P (macOS) or Shift+Ctrl+P (Windows) to bring up the Command Palette Type in User Settings in the prompt that appears. Select Preferences: Open User Settings don’t select the one…<\/p>\n","category_list_v2":"Tools<\/a>","author_info_v2":{"name":"Christopher Stein","url":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/author\/cstein\/"},"comments_num_v2":"1 comment","uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"post-thumbnail":false,"gform-image-choice-sm":false,"gform-image-choice-md":false,"gform-image-choice-lg":false},"uagb_author_info":{"display_name":"Christopher Stein","author_link":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/author\/cstein\/"},"uagb_comment_info":1,"uagb_excerpt":"Setup When we’re working with Eleventy, we will use Markdown and Nunjucks files. Markdown files have their own syntax but you can also use normal HTLM. Nunjucks are template files and we will mostly be writing HTML with some of the Nunjucks template syntax as well. However VS Code will not recognize these as HTML……","_links":{"self":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-json\/wp\/v2\/posts\/2705","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-json\/wp\/v2\/users\/16"}],"replies":[{"embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-json\/wp\/v2\/comments?post=2705"}],"version-history":[{"count":2,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-json\/wp\/v2\/posts\/2705\/revisions"}],"predecessor-version":[{"id":2709,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-json\/wp\/v2\/posts\/2705\/revisions\/2709"}],"wp:attachment":[{"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-json\/wp\/v2\/media?parent=2705"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-json\/wp\/v2\/categories?post=2705"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-json\/wp\/v2\/tags?post=2705"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/openlab.bmcc.cuny.edu\/mmp-350-spring23\/wp-json\/wp\/v2\/coauthors?post=2705"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
- item: *.md<\/strong> value: html<\/strong> then click OK<\/li>\n\n\n\n