title: How to include node_modules using webpack?
body: <p>In my angularJs 1.3 application, earlier I was using bower and grunt and it was working fine. I was adding files in my index.html like the following screenshot. But now I have installed all the packages using NPM and using WEbPack 4.21.0 for bundling and run the application. But now if I remove the packages link from Index.html file my application stops working. But I don't want all those links in Index.html and just want to generate a bundle file from those files. Kindly guide me how can I achieve this? Currently, its just adding angular.js file and few other files in vendor.js.</p>
  
  <p><strong>Index.html</strong></p>
  
  <p><a href="https://i.stack.imgur.com/h3lAb.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/h3lAb.png" alt="rerwer"></a></p>
  
  <p><strong>Package.json</strong></p>
  
  <p><a href="https://i.stack.imgur.com/AoYHP.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/AoYHP.png" alt="ssss"></a></p>
  
  <p><strong>webpack.config.js</strong></p>
  
  <p><a href="https://i.stack.imgur.com/KCCPG.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/KCCPG.png" alt="enter image description here"></a></p>
  
  <p><strong>Updated Question:</strong></p>
  
  <p>Now i am using following webpack.config.js but its creating <strong>bootstrap_and_some_plugin.css.js</strong> . It has to create css file but don't know why it's creating js file? </p>
  
  <pre><code>module.exports = {
    context: __dirname + '/app/scripts',
    resolve: {
      modules: ['bower_components', 'node_modules'],
      alias: {
        bower_components: __dirname + '/app/bower_components',
        assets: __dirname + '/app/assets'
      },
      extensions: ['.js', '.jsx', '.css']
    },
    module: {
      rules: [
        {
          test: /\.css$/,
          use: [
            { loader: "style-loader" },
            { loader: "css-loader" }
          ]
        },
        {
          test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
          use: [{
            loader: 'file-loader',
            options: {
              name: '[name].[ext]',
              outputPath: 'fonts/'
            }
          }]
        }
      ]
    },
    entry: {
      app: './main-app.js',
      'bootstrap_and_some_plugin.css': [
        'bower_components/font-awesome/css/font-awesome.css',
        'bower_components/seiyria-bootstrap-slider/dist/css/bootstrap-slider.min.css',
        'bower_components/angular-ui-tree/dist/angular-ui-tree.min.css',
      ]
    },
    output: {
      filename: '[name].js',
      path: __dirname + '/app/scripts',
      //chunkFilename: '[id].[chunkhash].js',
    },
    devServer: {
      contentBase: './app',
      host: 'localhost',
      port: '9000',
      inline: true,
      compress: true,
      proxy: {
        '/api/**': {
          //target: 'http://10.189.1.159:8080',
          target: 'http://localhost:9100',
          secure: false,
          changeOrigin: true,
          cookieDomainRewrite: true
        }
      },
      open: true
    },
    plugins: [
  
    ]
  };
  </code></pre>