Natuurlijk! Hier is een uitgebreide Neovim-configuratie die jouw workflow automatiseert voor JavaScript, HTML en CSS, inclusief automatische codeformattering en linting bij het opslaan. Ik zal plugins, scripts en keybindings voorstellen om je productiviteit te verhogen. **1. Pluginbeheer (bijvoorbeeld met 'packer.nvim')** Voeg onder je `init.lua` of `plugins.lua` de volgende plugins toe: ```lua require('packer').startup(function() use 'wbthomason/packer.nvim' -- Packer zelf use 'nvim-lua/plenary.nvim' -- Voor veel plugins use 'neovim/nvim-lspconfig' -- LSP configuratie use 'jose-elias-alvarez/null-ls.nvim' -- Voor linting en formattering use 'nvim-treesitter/nvim-treesitter' -- Syntax highlighting use 'MunifTanjim/prettier.nvim' -- Prettier integratie end) ``` **2. LSP en formattering / linting instellen** Gebruik `null-ls.nvim` voor formattering en linting: ```lua local null_ls = require("null-ls") local formatting = null_ls.builtins.formatting local diagnostics = null_ls.builtins.diagnostics null_ls.setup({ sources = { -- Formatter formatting.prettier.with({ filetypes = { "javascript", "html", "css" } }), -- Linter diagnostics.eslint.with({ filetypes = { "javascript" } }), }, on_attach = function(client, bufnr) if client.resolved_capabilities.document_formatting then vim.cmd([[ augroup LspFormatting autocmd! * <buffer> autocmd BufWritePre <buffer> lua vim.lsp.buf.formatting_sync() augroup END ]]) end end, }) ``` **3. Automatisering bij bestandssave** De bovenstaande `autocmd` zorgt dat formattering en linting automatisch gebeuren vóór het opslaan. **4. Keybindings voor manuele controle** Voeg handige sneltoetsen toe: ```lua vim.api.nvim_set_keymap('n', '<Leader>f', '<cmd>lua vim.lsp.buf.formatting()<CR>', { noremap = true, silent = true }) vim.api.nvim_set_keymap('n', '<Leader>l', '<cmd>lua vim.lsp.buf.hover()<CR>', { noremap = true, silent = true }) ``` **5. Extra tips voor productiviteit** - Gebruik `:Prettier` commando om handmatig te formatteren. - Configureer `.eslintrc.js` en `.prettierrc` bestanden voor consistente stijl. - Overweeg `nvim-treesitter` voor betere syntax highlighting en selectie. **Samenvatting** Deze setup automatiseert: - Format bij opslaan via Prettier - Linting via ESLint - Handige sneltoetsen voor formatteren en inspectie Met deze configuratie verhoog je je efficiëntie en houd je je code consistent en foutvrij! Als je hulp nodig hebt bij het integreren of aanpassen, laat het gerust weten!

Zeker! Hier is een complete Neovim-configuratie met geavanceerde automatisering voor JavaScript, HTML en CSS: ## init.lua - Hoofdconfiguratie ```lua -- Plugin Manager (lazy.nvim) local lazypath = vim.fn.stdpath("data") .. "/lazy/lazy.nvim" if not vim.loop.fs_stat(lazypath) then vim.fn.system({ "git", "clone", "--filter=blob:none", "https://github.com/folke/lazy.nvim.git", "--branch=stable", lazypath, }) end vim.opt.rtp:prepend(lazypath) -- Plugins require("lazy").setup({ -- Formattering {"jose-elias-alvarez/null-ls.nvim", dependencies = {"nvim-lua/plenary.nvim"}}, {"williamboman/mason.nvim"}, {"williamboman/mason-lspconfig.nvim"}, -- LSP {"neovim/nvim-lspconfig"}, -- Syntax & highlighting {"nvim-treesitter/nvim-treesitter", build = ":TSUpdate"}, -- Automatische save triggers {"Pocco81/auto-save.nvim"}, -- Extra tools {"windwp/nvim-autopairs"}, -- Automatische paren {"alvan/vim-closetag"}, -- HTML tag closing {"tpope/vim-commentary"}, -- Snel commenten }) -- LSP Configuratie local lspconfig = require("lspconfig") local capabilities = require("cmp_nvim_lsp").default_capabilities() -- JavaScript/TypeScript lspconfig.tsserver.setup({ capabilities = capabilities, on_attach = function(client, bufnr) -- Automatische format bij save vim.api.nvim_create_autocmd("BufWritePre", { buffer = bufnr, callback = function() vim.lsp.buf.format({ async = false }) end }) end }) -- HTML lspconfig.html.setup({ capabilities = capabilities, filetypes = {"html", "htmldjango"} }) -- CSS lspconfig.cssls.setup({ capabilities = capabilities }) -- Null-ls voor linting en formattering local null_ls = require("null-ls") null_ls.setup({ sources = { -- JavaScript/TypeScript null_ls.builtins.formatting.prettierd.with({ filetypes = {"javascript", "typescript", "javascriptreact", "typescriptreact"} }), null_ls.builtins.diagnostics.eslint_d, -- HTML null_ls.builtins.formatting.htmlbeautifier, -- CSS null_ls.builtins.formatting.stylelint, null_ls.builtins.diagnostics.stylelint, }, on_attach = function(client, bufnr) if client.server_capabilities.documentFormattingProvider then vim.api.nvim_create_autocmd("BufWritePre", { buffer = bufnr, callback = function() vim.lsp.buf.format({ async = false }) end }) end end }) -- Auto-save configuratie require("auto-save").setup({ enabled = true, trigger_events = {"InsertLeave", "TextChanged"}, execution_message = "💾 Auto-gesaved", conditions = { exists = true, filetype_is_not = {}, modifiable = true, }, }) -- Treesitter config require("nvim-treesitter.configs").setup({ ensure_installed = {"javascript", "html", "css", "lua", "vim"}, highlight = { enable = true }, indent = { enable = true }, }) -- Automatische paren require("nvim-autopairs").setup({}) -- HTML tag closing vim.g.closetag_filetypes = 'html,xhtml,phtml,javascriptreact,typescriptreact' vim.g.closetag_emptyTags_caseSensitive = 1 -- Keybindings vim.g.mapleader = " " -- Space als leader key -- Snel formatten met <leader>f vim.keymap.set("n", "<leader>f", vim.lsp.buf.format, { desc = "Format code" }) -- Snel save met automatisering vim.keymap.set("n", "<leader>w", ":w<CR>", { desc = "Save met auto-format" }) -- Linting toggle vim.keymap.set("n", "<leader>l", ":LspStop<CR>:LspStart<CR>", { desc = "Herstart LSP" }) -- Auto-comment toggle vim.keymap.set("n", "<leader>c", ":Commentary<CR>", { desc = "Toggle comment" }) -- Automatische bestandstype detectie vim.api.nvim_create_autocmd("FileType", { pattern = {"javascript", "html", "css"}, callback = function() -- Auto-indent instellen vim.opt.autoindent = true vim.opt.smartindent = true -- Tab instellingen vim.opt.tabstop = 2 vim.opt.shiftwidth = 2 vim.opt.softtabstop = 2 vim.opt.expandtab = true end }) -- Automatische syntax highlighting voor specifieke bestanden vim.api.nvim_create_autocmd({"BufRead", "BufNewFile"}, { pattern = {"*.js", "*.jsx", "*.ts", "*.tsx"}, command = "set filetype=javascript" }) vim.api.nvim_create_autocmd({"BufRead", "BufNewFile"}, { pattern = "*.html", command = "set filetype=html" }) vim.api.nvim_create_autocmd({"BufRead", "BufNewFile"}, { pattern = "*.css", command = "set filetype=css" }) ``` ## Aanvullende installatie-instructies ### Vereiste tools installeren: ```bash # Node.js packages npm install -g prettier eslint stylelint html-beautify # Mason packages (in Neovim) :MasonInstall prettierd eslint_d stylelint-lsp htmlbeautifier ``` ### Aanbevolen plugins voor extra productiviteit: ```lua -- Voeg toe aan je lazy.nvim setup: {"hrsh7th/nvim-cmp"}, -- Auto-completion {"hrsh7th/cmp-nvim-lsp"}, {"L3MON4D3/LuaSnip"}, -- Snippets {"akinsho/toggleterm.nvim"}, -- Terminal integratie {"nvim-lualine/lualine.nvim"}, -- Statusbalk ``` ### Gebruik: 1. **Auto-format bij save**: Werkt automatisch bij `:w` 2. **Handmatig formatten**: `<leader>f` 3. **Snel save**: `<leader>w` 4. **Comment toggle**: `<leader>c` Deze configuratie zorgt voor volledige automatisering van je workflow met professionele codekwaliteit tools! 🚀