Hi i am currently working on a Next Js project. I am using the Blockly package for my project. When i run the project locally using npm run dev,all works fine. However once i try to build the project i get the following error.
./node_modules/canvas/build/Release/canvas.node 1:0
Module parse failed: Unexpected character '' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)
> Build error occurred
Error: > Build failed because of webpack errors
at build (...node_modules/next/dist/build/index.js:13:917)
at process._tickCallback (internal/process/next_tick.js:68:7)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! nextjs-semantic@1.0.0 build: `next build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the nextjs-semantic@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
This is my next.config.js file
const withPlugins = require('next-compose-plugins');
const css = require('@zeit/next-css');
const nextConfig = {
target: 'serverless',
webpack(config) {
config.module.rules.push({
test: /\.(png|svg|jpg|eot|otf|ttf|woff|woff2|mp3)$/,
use: {
loader: 'url-loader',
options: {
limit: 8192,
publicPath: '/_next/static/',
outputPath: 'static/',
name: '[name].[ext]',
},
},
});
return config;
},
};
module.exports = withPlugins([[css]], nextConfig);
Please help. any help is appreciated. I do not need the canvas package. But i believe the Blockly package is using the jsdom package which in turn has the canvas package as a dependency. If there is a way to ignore jsdom and the canvas packages when building that would be fine as well. Please help i am a newbie to all these.