title: Using Webpack file-loader to import static json file gives file path instead of json contents
body: <p>I'm trying to use Webpack file-loader to copy a static json resource file to dist/ so I can import that json file in a Vue.js component. Webpack is copying the file correctly when I run <code>npm run build</code>, but when I try to import the file (like <code>import myJson from '@/static/runtimeConfig.json'</code>) then "myJSON" variable only gets the file path instead of the actual JSON file contents. Can anyone help me understand why this is?</p>
  
  <p>My webpack file-loader config looks like this:</p>
  
  <pre><code>module: {
        //load runtimeConfig.json file through a custom loader
        rules: [
          {
            // set the type to javascript/auto to bypass webpack's built-in json importing
            type: 'javascript/auto',
            test: /(runtimeConfig\.json)$/i,
            // file-loader resolves imports on a file and emits that file to dist/
            loader: 'file-loader',
            // use filename runtimeConfig.json instead of a hashed filename
            options: {
              name: '[path][name].[ext]',
              outputPath: 'static',
            }
          }
        ],
      },
  </code></pre>
  
  <p>My intent is to import a json file in a vue.js components, like this:</p>
  
  <pre><code>import myJson from '@/static/runtimeConfig.json'
  </code></pre>
  
  <p>But, after I do that import, myJson is just the path to the file, not the actual json contents</p>
  
  <pre><code>console.log(myJson)
  --&gt; /static/src/static/runtimeConfig.json
  </code></pre>