npm and vanilla JS are still relevant. Bower and gulp are used far less these days for new projects, but many jobs are still going to require them.
Frameworks are useful to learn - they help to consolidate best practices and still provide a significant leg up so that you can get work done quickly. They provide ready abstractions that even more experienced developers appreciate as helpful. Anyone can write poorly performing or unmaintainable code with or without frameworks, so it's more about learning how the framework operates and researching best practices rather than avoiding them altogether.
React (more of a library) and Angular are dominant and likely to stick around for a while. Learning one or both of these is going to keep your skills relevant and let you code efficiently, regardless of your opinion of them individually. Both will help you write SPAs that can be maintained for more than a couple of pages or forms. Vue.js is a fast up and comer.
Understanding how to use a bundler like Webpack or Parcel is vital to the modern web. They streamline the process packaging your JS, CSS and other web artifacts by providing a plugin architecture for transpilation, removing dead code, minifying it and preparing it for web distribution. Any non-trivial application will benefit from it in the long run. With webpack, you can just include an npm module and it will be linked into your application from it's main entry point far easier than bower.
You can avoid dealing with bundlers directly by using templates or tightly maintained generators for react (create-react-app) or angular, but at some point you will need to understand how they work and how their plugin architectures operate. Webpack has an excellent manual these days and is well maintained compared to gulp, so it's worth taking a look and attempting to build up a config yourself (if only to learn). Be careful when referring to older tutorials, as it's architecture has changed significantly between v1 and v2/3 and many early issues around 3rd party plugins have long been addressed.
SaSS is still not a bad CSS transpiler - there are other options (particularly for working with React) but there is nothing wrong with raw CSS. There is no silver bullet, and it all comes down to structuring your CSS correctly, using conventions, and being prepared to refactor it proactively as new requirements or technical debt emerges. Bundlers like Webpack can make it easier to link and minify CSS into your application and provide auto-reloading during development.
Babel is a nice to have, especially when targeting older browser but using the latest ES6 or ES7 syntax. It plugs into webpack very easily.
You may also consider Typescript or Flow or Reason if you want to improve the safety and reliability of your code, and pick up more errors at development time. Typescript has the best overall support at the moment.
Eslint is the de-facto linter without these frameworks (and is recommended if you choose to write raw JS) and can still be excellent (albeit difficult to configure). Always start with a less restrictive configuration (such as eslint:recommended) and add rules as you go - there are defaults from airbnb and google, but you often spend too much time trying to match their strictly enforced code style instead of writing readable code. You won't need more than a half a dozen extra rules beyond this.