Laravel Mix 和 Webpack：无法加载 JSON 文件（Webpack 添加 .js 到文件名）

Question

我从 Webpack 收到以下错误：

ERROR in ./resources/assets/js/data/vehicles.json.js
Module build failed: Error: ENOENT: no such file or directory, open '/Users/path-to-my-app/resources/assets/js/data/vehicles.json.js'

我对文件加载失败并不感到惊讶。 JSON 文件不叫 vehicles.json.js。它被称为vehicles.json。

导入文件的行是：

import vehicleTypes from '../data/vehicles.json'

但是，如果我将文件名更改为 vehicles.js（并使用导出语句使其成为一个模块）并将导入语句更改为：

import vehicleTypes from '../data/vehicles.js'

Webpack 工作正常。

我的印象是最新的 webpack 可以在不配置任何东西的情况下加载 JSON 个文件。

Answer 1

Since webpack >= v2.0.0, importing of JSON files will work by default. You might still want to use this if you use a custom file extension.

您可能使用的是旧版本的 webpack，这可以解释原因默认情况下加载器不工作。

尝试将其作为自定义加载器添加到您的 webpack.mix.js 文件中。

安装加载程序：

npm install --save-dev json-loader

并声明自定义加载器：

mix.webpackConfig({
         module: {
           loaders: [{
             test: /\.json$/,
             loader: 'json-loader'
             }]
           }
       });

而且您应该能够像预期的那样导入 .json 文件。

Laravel Mix 和 Webpack：无法加载 JSON 文件（Webpack 添加 .js 到文件名）

Laravel Mix and Webpack: Cannot Load JSON File (Webpack Adding .js to Filename)

javascript

laravel

webpack

laravel-mix