twopluszero / next-images

Import images in Next.js (supports jpg, jpeg, svg, png and gif images)
MIT License
949 stars 67 forks source link

The image import in pkg don't work #8

Closed bing1021 closed 5 years ago

bing1021 commented 6 years ago

Hi! I use your pkg.

I used a pkg and the pkg import a image. But webpack does't resolve the image.

Here is the error message

7c24518b-7523-4cdd-8083-971cd9c1b841

Why?

arefaslani commented 6 years ago

@bing1021. I didn't tested it with other packages that import images. At the moment I'm so busy and I don't think that I can do much to solve the problem. Give me some time and I will take a look at it. Alternatively if you solved the issue please submit a pull request. Thanks :)

tarang9211 commented 6 years ago
const withSass = require('@zeit/next-sass');
const withImages = require('next-images');
module.exports = withSass({
  sassLoaderOptions: {
    includePaths: ['./styles/']
  },
  cssModules: true,
  cssLoaderOptions: {
    importLoaders: 1,
    localIdentName: '[local]___[hash:base64:5]'
  },
  withImages: withImages
});

This configuration doesnt work.

arefaslani commented 5 years ago

@tarang9211 Hi! I've answered this question before in this issue https://github.com/twopluszero/next-images/issues/10. Please check it out and if there is still problems, let's discuss about it on the related issue.

arefaslani commented 5 years ago

Hey @bing1021. Could you please share steps to reproduce the issue?

vget98 commented 5 years ago

I am having this exact problem and was hoping for an update

const withPlugins = require('next-compose-plugins');

const withTypescript = require('@zeit/next-typescript')
const withCSS = require('@zeit/next-css')
const withSass = require('@zeit/next-sass');
const withBundleAnalyzer = require("@zeit/next-bundle-analyzer");
const nextRuntimeDotenv = require('next-runtime-dotenv');
const withImages = require('next-images');

const withConfig = nextRuntimeDotenv({
    public: [
        'API_URL'
    ]
})

module.exports = withPlugins(
    [
        [withTypescript],
        [withCSS],
        [withSass],
        [withBundleAnalyzer],
        [withConfig],
        [withImages],
    ],
    {
        analyzeServer: ["server", "both"].includes(process.env.BUNDLE_ANALYZE),
        analyzeBrowser: ["browser", "both"].includes(process.env.BUNDLE_ANALYZE),
        bundleAnalyzerConfig: {
            server: {
                analyzerMode: 'static',
                reportFilename: '../bundles/server.html'
            },
            browser: {
                analyzerMode: 'static',
                reportFilename: '../bundles/client.html'
            }
        }
    }
);
arefaslani commented 5 years ago

Hi @vget98, Can you provide a small project that causes this error so that we can find and resolve the issue?

arefaslani commented 5 years ago

I've closed this issue because it doesn't have any new conversation. Feel free to reopen it if you think you still have the problem.