New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Generating output with different contents but the same hash #2631

Closed
markcatley opened this Issue Oct 26, 2017 · 2 comments

Comments

Projects
None yet
2 participants
@markcatley
Copy link

markcatley commented Oct 26, 2017

Hi,

I am having trouble with some of my js files outputting different content with the same hashes. This gives me javascript exceptions because due to caching I have some files from the old build and some from the new saved in the CDN.

The result is I get Uncaught TypeError: Cannot read property 'call' of undefined in webpackJsonp until I invalidate the cache in the CDN and browser and the browser-based js doesn't work.

package.json:

{
  "name": "",
  "description": "",
  "version": "1.0.0",
  "author": "",
  "dependencies": {
    "gatsby": "^1.9.24",
    "gatsby-image": "^1.0.14",
    "gatsby-link": "^1.6.8",
    "gatsby-plugin-favicon": "^1.0.0",
    "gatsby-plugin-google-tagmanager": "^1.0.7",
    "gatsby-plugin-manifest": "^1.0.4",
    "gatsby-plugin-preact": "^1.0.3",
    "gatsby-plugin-react-helmet": "^1.0.3",
    "gatsby-plugin-sharp": "^1.6.6",
    "gatsby-plugin-typography": "^1.7.6",
    "gatsby-remark-copy-linked-files": "^1.5.7",
    "gatsby-remark-images": "^1.5.10",
    "gatsby-remark-prismjs": "^1.2.1",
    "gatsby-remark-responsive-iframe": "^1.4.3",
    "gatsby-remark-smartypants": "^1.4.3",
    "gatsby-source-filesystem": "^1.4.12",
    "gatsby-transformer-csv": "^1.3.5",
    "gatsby-transformer-json": "^1.0.11",
    "gatsby-transformer-remark": "^1.7.7",
    "gatsby-transformer-sharp": "^1.6.5",
    "gray-percentage": "^2.0.0",
    "lodash": "^4.15.0",
    "node-sass": "^4.5.3",
    "prop-types": "^15.5.10",
    "react": "^15.6.0",
    "react-helmet": "^5.2.0",
    "react-responsive-grid": "^0.3.3",
    "react-router": "^4.2.0",
    "react-twitter-widgets": "^1.7.1",
    "typography": "^0.16.6",
    "typography-breakpoint-constants": "^0.15.10"
  },
  "devDependencies": {
    "babel-eslint": "^8.0.1",
    "eslint": "^4.6.1",
    "eslint-config-airbnb": "^16.0.0",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-jsx-a11y": "^6.0.2",
    "eslint-plugin-react": "^7.3.0",
    "prettier": "^1.5.3"
  },
  "license": "UNLICENSED",
  "private": true,
  "main": "n/a",
  "scripts": {
    "dev": "gatsby develop",
    "lint": "./node_modules/.bin/eslint --ext .js,.jsx --ignore-pattern public --fix .",
    "test": "echo \"Error: no test specified\" && exit 1",
    "format": "prettier --trailing-comma es5 --no-semi --single-quote --write 'src/**/*.js'",
    "develop": "gatsby develop",
    "build": "gatsby build"
}

gatsby-node.js:

const _ = require('lodash');
const path = require('path');

exports.createPages = ({ graphql, boundActionCreators }) => {
  const { createPage } = boundActionCreators;

  return new Promise((resolve, reject) => {
    const blogPost = path.resolve('./src/templates/blog-post.js');
    resolve(graphql(`
          {
            allMarkdownRemark(
              limit: 1000,
              filter: { frontmatter: { published: { eq: true } } }
            ) {
              edges {
                node {
                  frontmatter {
                    path
                  }
                }
              }
            }
          }
        `).then((result) => {
      if (result.errors) {
        /* eslint-disable no-console */
        console.log(result.errors);
        /* eslint-enable no-console */
        reject(result.errors);
      }

      // Create blog posts pages.
      _.each(result.data.allMarkdownRemark.edges, (edge) => {
        createPage({
          path: edge.node.frontmatter.path,
          component: blogPost,
          context: {
            path: edge.node.frontmatter.path,
          },
        });
      });
    }));
  });
};

exports.modifyWebpackConfig = ({ config }) => {
  config.loader('file-loader', {
    query: {
      name: 'assets/[name].[hash:8].[ext]',
    },
  });
  config.loader('url-loader', {
    query: {
      name: 'assets/[name].[hash:8].[ext]',
    },
  });
};

gatsby-config.js

module.exports = {
  siteMetadata: {
    title: '',
  },
  mapping: {
    'MarkdownRemark.frontmatter.author': 'AuthorsJson',
  },
  plugins: [
    {
      resolve: 'gatsby-source-filesystem',
      options: {
        path: `${__dirname}/src/pages`,
        name: 'pages',
      },
    },
    {
      resolve: 'gatsby-transformer-remark',
      options: {
        plugins: [
          {
            resolve: 'gatsby-remark-images',
            options: {
              maxWidth: 590,
            },
          },
          {
            resolve: 'gatsby-remark-responsive-iframe',
            options: {
              wrapperStyle: 'margin-bottom: 1.0725rem',
            },
          },
          'gatsby-remark-prismjs',
          'gatsby-remark-copy-linked-files',
          'gatsby-remark-smartypants',
        ],
      },
    },
    'gatsby-transformer-sharp',
    'gatsby-plugin-sharp',
    {
      resolve: 'gatsby-plugin-google-tagmanager',
      options: {
        id: '',
      },
    },
    'gatsby-plugin-react-helmet',
    {
      resolve: 'gatsby-plugin-typography',
      options: {
        pathToConfigModule: 'src/utils/typography',
      },
    },
    'gatsby-transformer-csv',
    'gatsby-plugin-favicon',
    'gatsby-transformer-json',
  ],
};

I am running node v8.7.0 on MacOS X High Sierra. Any ideas?

@KyleAMathews

This comment has been minimized.

Copy link
Contributor

KyleAMathews commented Oct 26, 2017

Yeah… short answer is we aren't able to make JavaScript actually cachable with webpack 1. I'm pretty sure this is fixable for the coming upgrade to webpack 3 but for now, don't cache JS just things in /static/.

Planning on writing a Gatsby caching docs page soon.

@markcatley

This comment has been minimized.

Copy link
Author

markcatley commented Oct 26, 2017

Thanks for that. Nice to know I am not going insane.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment