vue项目中webpack打包glsl文件不能编译，You may need an appropriate loader to handle this file type

最近跟着学了下three的着色器，编写的GLSL文件，编译的时候报错，看意思可能是缺少loader，苦于不知道是那个loader，一番百度查询到的，在此记录一下。2、修改vue.config.js配置，添加内容如下。安装webpack-glsl-loader。

啊柒_

8701人浏览 · 2022-12-28 14:55:04

啊柒_ · 2022-12-28 14:55:04 发布

报错内容如下

You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file.

在这里插入图片描述

最近跟着学了下three的着色器，编写的GLSL文件，编译的时候报错，看意思可能是缺少loader，苦于不知道是那个loader，一番百度查询到的，在此记录一下
1、 npm install --save-dev webpack-glsl-loader 安装webpack-glsl-loader
2、修改vue.config.js配置，添加内容如下

  configureWebpack: (config) => {
    config.module.rules.push({
      test: /\.glsl$/,

      use: [
        {
          loader: "webpack-glsl-loader",
        },
      ],
    });
  },