terapha
terapha

Reputation: 21

Json file was not found by webpack

I am developing a small personal project, i need to import json files with webpack but impossible

package.json contain:

    "webpack": "^4.17.1"
    "json-loader": "^0.5.7",

webpack.config.js contain

{ test: /\.json$/, use: 'json-loader' },

I dont know what vs code tell me this issue

import * as data from './loading.json';
- Cannot resolve module 'json' - 

a question "Load static JSON file in Webpack" do not solve my problem and with json-loader or not this issue still present

Upvotes: 2

Views: 4334

Answers (1)

Jonathan  Tsai
Jonathan Tsai

Reputation: 234

As mentioned, you no longer need json-loader for .json since webpack 2.0.0.

However, if you are using json-loader because you don't want to bundle the json file, then I would recommend using one of the following solutions:

  1. Use Copy Webpack Plugin to copy the json file into the build directory.

  2. Use type = 'javascript/auto'

For example(note that this example uses file-loader instead of json-loader):

{
  type: 'javascript/auto',
  test: /\.json$/,
  use: [
    {
      loader: 'file-loader',
      include: [path.resolve(__dirname, 'src')],
      options: {
          name: '[name].[ext]'
      }
    }
  ]
}

Updated: Added include. Remember to place the json file in the src folder.

For more information, please check out this page: Webpack 4.0 file-loader json issue

Upvotes: 1

Related Questions