Skip to content

Commit

Permalink
Ensure chunkNames are unique by using relative path to site root
Browse files Browse the repository at this point in the history
  • Loading branch information
KyleAMathews committed Sep 29, 2016
1 parent 342030d commit a1dfe19
Show file tree
Hide file tree
Showing 8 changed files with 16 additions and 12 deletions.
8 changes: 8 additions & 0 deletions lib/bootstrap/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,8 @@ import mkdirp from 'mkdirp'
import fs from 'fs-extra'
import Joi from 'joi'
import chalk from 'chalk'
const { layoutComponentChunkName } = require(`../utils/js-chunk-names`)

const mkdirs = Promise.promisify(fs.mkdirs)
const copy = Promise.promisify(fs.copy)

Expand Down Expand Up @@ -39,6 +41,7 @@ const autoPathCreator = (program) => {
// Create initial page objects.
autoPages = files.map((filePath) => ({
component: filePath,
chunkName: layoutComponentChunkName(program.directory, filePath),
path: filePath,
}))

Expand Down Expand Up @@ -148,6 +151,11 @@ module.exports = async (program, cb) => {
// Collect pages.
const pages = await apiRunnerNode(`createPages`, { graphql: graphqlRunner }, [])

// Add chunkName.
pages.forEach((page) => (
page.chunkName = layoutComponentChunkName(program.directory, page.component)
))

// Validate pages.
if (pages) {
pages.forEach((page) => {
Expand Down
1 change: 1 addition & 0 deletions lib/joi-schemas/joi.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,5 +9,6 @@ export const gatsbyConfigSchema = Joi.object().keys({
export const pageSchema = Joi.object().keys({
path: Joi.string().required(),
component: Joi.string().required(),
chunkName: Joi.string().required(),
data: Joi.object(),
}).unknown()
1 change: 0 additions & 1 deletion lib/utils/build-javascript.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ module.exports = (program, callback) => {
const { directory } = program

const compilerConfig = webpackConfig(program, directory, `build-javascript`)
console.log('webpack config for JS', JSON.stringify(compilerConfig.resolve(), null, 4))

webpack(compilerConfig.resolve()).run(callback)
}
6 changes: 3 additions & 3 deletions lib/utils/js-chunk-names.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,9 @@ const pathChunkName = (path) => {
return `path---${name}`
}

const layoutComponentChunkName = (componentPath) => {
const name = path.basename(componentPath, path.extname(componentPath))
return `page-template---${_.kebabCase(name)}`
const layoutComponentChunkName = (directory, componentPath) => {
const name = path.relative(directory, componentPath)
return `page-component---${_.kebabCase(name)}`
}

exports.pathChunkName = pathChunkName
Expand Down
2 changes: 1 addition & 1 deletion lib/utils/query-runner.js
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ const writeChildRoutes = () => {

const genSplitChildRoute = (page, noPath=false) => {
const pathName = pathChunkName(page.path)
const layoutName = layoutComponentChunkName(page.component)
const layoutName = layoutComponentChunkName(programDB().directory, page.component)
let pathStr = ``
if (!noPath) {
if (programDB().prefixLinks) {
Expand Down
4 changes: 1 addition & 3 deletions lib/utils/static-entry.js
Original file line number Diff line number Diff line change
Expand Up @@ -57,9 +57,7 @@ module.exports = (locals, callback) => {
scripts.push(pathChunkName(locals.path))
// layout component chunk
scripts.push(
layoutComponentChunkName(
pages.find((page) => page.path === locals.path).component
)
pages.find((page) => page.path === locals.path).chunkName
)

const html = `<!DOCTYPE html>\n ${renderToStaticMarkup(
Expand Down
4 changes: 1 addition & 3 deletions lib/utils/webpack.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -135,9 +135,8 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, pages =
case `build-javascript`: {
// Get array of page template component names.
let components = Array.from(pagesDB().values()).map(page => page.component)
components = components.map(component => layoutComponentChunkName(component))
components = components.map(component => layoutComponentChunkName(program.directory, component))
components = _.uniq(components)
console.log('components', components)
return [
// Moment.js includes 100s of KBs of extra localization data
// by default in Webpack that most sites don't want.
Expand All @@ -155,7 +154,6 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, pages =
`app`,
...components,
],
children: false,
// The more page components there are, the higher we raise the bar
// for merging in page-specific JS libs into the commons chunk. The
// two principles here is a) keep the TTI (time to interaction) as
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "gatsby",
"description": "React.js Static Site Generator",
"version": "1.0.0-alpha.test7",
"version": "1.0.0-alpha.test8",
"author": "Kyle Mathews <[email protected]>",
"ava": {
"require": [
Expand Down

0 comments on commit a1dfe19

Please sign in to comment.