1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
next.js/examples/with-absolute-imports
Telegin Evgeniy 6cdd7cb291 Update with-absolute-imports example to Babel 7 (#4610)
Hello!

I have updated `babel-plugin-module-resolver` to `^3.1.1` and moved it to `devDependencies` in [with-absolute-imports](https://github.com/zeit/next.js/tree/canary/examples/with-absolute-imports) example to make it work with Babel 7 :)

## Error logs
```
zhenyatelegin@MBP-Zhenya  ~/Desktop/next.js/examples/with-absolute-imports   canary  yarn build
yarn run v1.5.1
warning package.json: No license field
$ next build
> Failed to build
{ Error: (client) ./pages/index.js
Module build failed: Error: Cannot find module 'babel-plugin-module-resolver' from '/Users/zhenyatelegin/Desktop/next.js/examples/with-absolute-imports'
    at Function.module.exports [as sync] (/Users/zhenyatelegin/Desktop/next.js/node_modules/resolve/lib/sync.js:40:15)
    at resolveStandardizedName (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/files/plugins.js:78:29)
    at resolvePlugin (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/files/plugins.js:27:10)
    at loadPlugin (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/files/plugins.js:35:18)
    at createDescriptor (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:152:21)
    at /Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:104:12
    at Array.map (<anonymous>)
    at createDescriptors (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:103:27)
    at createPluginDescriptors (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:99:10)
    at /Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:50:19
    at plugins (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:40:25)
    at mergeChainOpts (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-chain.js:296:68)
    at /Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-chain.js:251:7
    at buildRootChain (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-chain.js:85:20)
    at loadPrivatePartialConfig (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/partial.js:41:53)
    at Object.loadPartialConfig (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/partial.js:66:16)
 @ multi ./pages/index.js
    at /Users/zhenyatelegin/Desktop/next.js/dist/server/build/index.js:144:31
    at runWithDependencies (/Users/zhenyatelegin/Desktop/next.js/node_modules/webpack/lib/MultiCompiler.js:154:4)
    at /Users/zhenyatelegin/Desktop/next.js/node_modules/async/dist/async.js:1140:9
    at /Users/zhenyatelegin/Desktop/next.js/node_modules/async/dist/async.js:473:16
    at iteratorCallback (/Users/zhenyatelegin/Desktop/next.js/node_modules/async/dist/async.js:1064:13)
    at /Users/zhenyatelegin/Desktop/next.js/node_modules/async/dist/async.js:969:16
    at /Users/zhenyatelegin/Desktop/next.js/node_modules/async/dist/async.js:1137:13
    at runCompilers (/Users/zhenyatelegin/Desktop/next.js/node_modules/webpack/lib/MultiCompiler.js:96:47)
    at fn (/Users/zhenyatelegin/Desktop/next.js/node_modules/webpack/lib/MultiCompiler.js:101:6)
    at compiler.run (/Users/zhenyatelegin/Desktop/next.js/node_modules/webpack/lib/MultiCompiler.js:150:5)
    at emitRecords.err (/Users/zhenyatelegin/Desktop/next.js/node_modules/webpack/lib/Compiler.js:265:13)
    at Compiler.emitRecords (/Users/zhenyatelegin/Desktop/next.js/node_modules/webpack/lib/Compiler.js:371:38)
    at emitAssets.err (/Users/zhenyatelegin/Desktop/next.js/node_modules/webpack/lib/Compiler.js:258:10)
    at applyPluginsAsyncSeries1.err (/Users/zhenyatelegin/Desktop/next.js/node_modules/webpack/lib/Compiler.js:364:12)
    at next (/Users/zhenyatelegin/Desktop/next.js/node_modules/tapable/lib/Tapable.js:218:11)
    at Compiler.compiler.plugin (/Users/zhenyatelegin/Desktop/next.js/node_modules/webpack/lib/performance/SizeLimitsPlugin.js:99:4)
  errors:
   [ '(client) ./pages/index.js\nModule build failed: Error: Cannot find module \'babel-plugin-module-resolver\' from \'/Users/zhenyatelegin/Desktop/next.js/examples/with-absolute-imports\'\n    at Function.module.exports [as sync] (/Users/zhenyatelegin/Desktop/next.js/node_modules/resolve/lib/sync.js:40:15)\n    at resolveStandardizedName (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/files/plugins.js:78:29)\n    at resolvePlugin (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/files/plugins.js:27:10)\n    at loadPlugin (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/files/plugins.js:35:18)\n    at createDescriptor (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:152:21)\n    at /Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:104:12\n    at Array.map (<anonymous>)\n    at createDescriptors (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:103:27)\n    at createPluginDescriptors (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:99:10)\n    at /Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:50:19\n    at plugins (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:40:25)\n    at mergeChainOpts (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-chain.js:296:68)\n    at /Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-chain.js:251:7\n    at buildRootChain (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-chain.js:85:20)\n    at loadPrivatePartialConfig (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/partial.js:41:53)\n    at Object.loadPartialConfig (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/partial.js:66:16)\n @ multi ./pages/index.js',
     '(server) ./pages/index.js\nModule build failed: Error: Cannot find module \'babel-plugin-module-resolver\' from \'/Users/zhenyatelegin/Desktop/next.js/examples/with-absolute-imports\'\n    at Function.module.exports [as sync] (/Users/zhenyatelegin/Desktop/next.js/node_modules/resolve/lib/sync.js:40:15)\n    at resolveStandardizedName (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/files/plugins.js:78:29)\n    at resolvePlugin (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/files/plugins.js:27:10)\n    at loadPlugin (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/files/plugins.js:35:18)\n    at createDescriptor (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:152:21)\n    at /Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:104:12\n    at Array.map (<anonymous>)\n    at createDescriptors (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:103:27)\n    at createPluginDescriptors (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:99:10)\n    at /Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:50:19\n    at plugins (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-descriptors.js:40:25)\n    at mergeChainOpts (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-chain.js:296:68)\n    at /Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-chain.js:251:7\n    at buildRootChain (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/config-chain.js:85:20)\n    at loadPrivatePartialConfig (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/partial.js:41:53)\n    at Object.loadPartialConfig (/Users/zhenyatelegin/Desktop/next.js/node_modules/@babel/core/lib/config/partial.js:66:16)\n @ multi ./pages/index.js' ],
  warnings: [] }
error An unexpected error occurred: "Command failed.
Exit code: 1
Command: sh
Arguments: -c next build
Directory: /Users/zhenyatelegin/Desktop/next.js/examples/with-absolute-imports
Output:
".
info If you think this is a bug, please open a bug report with the information provided in "/Users/zhenyatelegin/Desktop/next.js/examples/with-absolute-imports/yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
```
2018-06-15 11:10:25 +02:00
..
components Example: with absolute imports (#2863) 2017-08-30 20:03:36 +02:00
pages Example: with absolute imports (#2863) 2017-08-30 20:03:36 +02:00
.babelrc Presets should be array (#3996) 2018-03-12 17:30:28 +01:00
package.json Update with-absolute-imports example to Babel 7 (#4610) 2018-06-15 11:10:25 +02:00
README.md Examples: stabalise README format and create-next-app usage (#4009) 2018-04-03 14:19:05 +02:00

Example app with absolute imports

How to use

Using create-next-app

Execute create-next-app with Yarn or npx to bootstrap the example:

npx create-next-app --example with-absolute-imports with-absolute-imports-app
# or
yarn create next-app --example with-absolute-imports with-absolute-imports-app

Download manually

Download the example or clone the repo:

curl https://codeload.github.com/zeit/next.js/tar.gz/canary | tar -xz --strip=2 next.js-canary/examples/with-absolute-imports
cd with-absolute-imports

Install it and run:

npm install
npm run dev
# or
yarn
yarn dev

Deploy it to the cloud with now (download)

now

The idea behind the example

This example shows how to configure Babel to have absolute imports instead of relative imports without modifying the Webpack configuration.