nuxt / nuxt

The Intuitive Vue Framework.

Nuxt

Nuxt is a free and open-source framework with an intuitive and extendable way to create type-safe, performant and production-grade full-stack web applications and websites with Vue.js.

It provides a number of features that make it easy to build fast, SEO-friendly, and scalable web applications, including:

• Server-side rendering, Static Site Generation, Hybrid Rendering and Edge-Side Rendering
• Automatic routing with code-splitting and pre-fetching
• Data fetching and state management
• SEO Optimization and Meta tags definition
• Auto imports of components, composables and utils
• TypeScript with zero configuration
• Go fullstack with our server/ directory
• Extensible with 200+ modules
• Deployment to a variety of hosting platforms
• ...and much more 🚀

Table of Contents

• 🚀 Getting Started
• 💻 Vue Development
• 📖 Documentation
• 🧩 Modules
• ❤️ Contribute
• 🏠 Local Development
• ⛰️ Nuxt 2
• 🔗 Follow us
• ⚖️ License

---

🚀 Getting Started

Use the following command to create a new starter project. This will create a starter project with all the necessary files and dependencies:

npx nuxi@latest init <my-project>

Tip

Discover also nuxt.new: Open a Nuxt starter on CodeSandbox, StackBlitz or locally to get up and running in a few seconds.

💻 Vue Development

Simple, intuitive and powerful, Nuxt lets you write Vue components in a way that makes sense. Every repetitive task is automated, so you can focus on writing your full-stack Vue application with confidence.

Example of an app.vue:

<script setup lang="ts">
useSeoMeta({
  title: 'Meet Nuxt',
  description: 'The Intuitive Vue Framework.'
})
</script>

<template>
  <div id="app">
    <AppHeader />
    <NuxtPage />
    <AppFooter />
  </div>
</template>

<style scoped>
#app {
  background-color: #020420;
  color: #00DC82;
}
</style>

📖 Documentation

We highly recommend you take a look at the Nuxt documentation to level up. It’s a great resource for learning more about the framework. It covers everything from getting started to advanced topics.

🧩 Modules

Discover our list of modules to supercharge your Nuxt project, created by the Nuxt team and community.

❤️ Contribute

We invite you to contribute and help improve Nuxt 💚

Here are a few ways you can get involved:

• Reporting Bugs: If you come across any bugs or issues, please check out the reporting bugs guide to learn how to submit a bug report.
• Suggestions: Have ideas to enhance Nuxt? We'd love to hear them! Check out the contribution guide to share your suggestions.
• Questions: If you have questions or need assistance, the getting help guide provides resources to help you out.

🏠 Local Development

Follow the docs to Set Up Your Local Development Environment to contribute to the framework and documentation.

⛰️ Nuxt 2

You can find the code for Nuxt 2 on the 2.x branch and the documentation at v2.nuxt.com.

🔗 Follow us

    

⚖️ License

MIT

nuxt's Issues

Async data in nested component

Hi,

It seems that loading async data is pretty easy from pages, yet I don't find any way to load data asynchronously from nested components.

To explain what I try to do, I made some example project: https://github.com/Xowap/nuxttest

You'll see that data loaded from index.vue is correctly rendered server-side yet data in HttpBin.vue isn't displayed at all and triggers an error.

Is that an anti-pattern? A feature to come?

Thanks,
Rémy

_{This question is available on Nuxt.js community (#c24)}

Release 0.8.4 not updated

I updated nuxt to 0.8.4 but the lib/nuxt.js is not the same as the github tag.
I´m trying to use the new option srcDir.
I already deleted the node_modules and yarn.lock, I tried to install using npm and yarn.

My local/installed file: lines 51 to 55

// Env variables
this.dev = this.options.dev
this.dir = (typeof options.rootDir === 'string' && options.rootDir ? options.rootDir : process.cwd())
// If store defined, update store options to true
if (fs.existsSync(join(this.dir, 'store', 'index.js'))) {

https://github.com/nuxt/nuxt.js/blob/v0.8.4/lib/nuxt.js

 // Env variables
 this.dev = this.options.dev
 this.dir = (typeof options.rootDir === 'string' && options.rootDir ? options.rootDir : process.cwd())
 this.srcDir = (typeof options.srcDir === 'string' && options.srcDir ? resolve(this.dir, options.srcDir) : this.dir)
 // If store defined, update store options to true
 if (fs.existsSync(join(this.srcDir, 'store', 'index.js'))) {

My package.json

{
  "name": "test-nuxt",
  "version": "1.0.0",
  "description": "Nuxt.js project",
  "author": "",
  "private": true,
  "dependencies": {
    "axios": "^0.15.3",
    "express": "^4.14.0",
    "nuxt": "^0.8.4"
  },
  "scripts": {
    "dev": "nuxt",
    "build": "nuxt build",
    "start": "node server",
    "generate": "nuxt generate"
  }
}

package json inside node_modules/nuxt folder:

{
  "_args": [
    [
      {
        "raw": "nuxt@^0.8.4",
        "scope": null,
        "escapedName": "nuxt",
        "name": "nuxt",
        "rawSpec": "^0.8.4",
        "spec": ">=0.8.4 <0.9.0",
        "type": "range"
      },
      "C:\\Users\\DNPO\\projects\\church-nuxt"
    ]
  ],
  "_from": "nuxt@>=0.8.4 <0.9.0",
  "_id": "[email protected]",

_{This bug report is available on Nuxt.js community (#c43)}

Register new route

I created a page file and linked to it using the <router-link> element, but it 404s.

I see in the .nuxt folder there are some routes defined e.g.

const _3cb81d92 = process.BROWSER_BUILD ? () => System.import('/Users/heydonpickering/repositories/project-folder/pages/about.vue') : require('/Users/heydonpickering/repositories/project-folder/pages/about.vue')

These are clearly added dynamically on webpack build, but I don't know where to add a new one?

Many thanks.

_{This question is available on Nuxt.js community (#c45)}

'Window is not defined' where do I put client-side only scripts?

I'm trying to run a-frame in one of my vue pages but I'm getting an error in my browser:
ReferenceError: window is not defined

I'm guessing this is because nuxt is trying to run the aframe module while rendering the page on the server.

<template>
    <div>
        <a-scene fog="type: linear; color: #FFEBDE; far:190"  debug>
            <a-entity>
                <a-collada-model src="/obj/banner.dae"></a-collada-model>
                <a-ring color="teal" radius-inner="1" radius-outer="2"></a-ring>
            </a-entity>

            <a-entity position="0 -1 10">
                <a-camera>
                    <a-cursor color="#2E3A87"></a-cursor>
                </a-camera>
            </a-entity>
            <a-entity camera="userHeight: 1.6" look-controls></a-entity>
        </a-scene>
    </div>
</template>

<script>
import 'aframe';

export default {
    mounted() {

    }
}
</script>

_{This question is available on Nuxt.js community (#c30)}

srcDir error layout folder

I'm trying to use the srcDir with express. When I access the page, this red message appears:

Vue.js error

Error: Cannot find module "C:\Users\DNPO\projects\church-nuxt\layouts\error.vue"
    at webpackMissingModule (__vue_ssr_bundle__:435:78)
    at Object.module.exports.Object.defineProperty.value (__vue_ssr_bundle__:435:213)
    at __webpack_require__ (__vue_ssr_bundle__:21:30)
    at Object.module.exports.__vue_styles__ (__vue_ssr_bundle__:734:19)
    at __webpack_require__ (__vue_ssr_bundle__:21:30)
    at Object.module.exports.exports.b (__vue_ssr_bundle__:92:79)
    at __webpack_require__ (__vue_ssr_bundle__:21:30)
    at Object.<anonymous> (__vue_ssr_bundle__:1034:65)
    at __webpack_require__ (__vue_ssr_bundle__:21:30)
    at __vue_ssr_bundle__:65:18

my nuxt.config.js

const { resolve } = require('path');

module.exports = {
  srcDir: resolve('./app'),
  head: {
    title: 'starter',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', content: "Nuxt.js project" }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: 'favicon.ico' }
    ]
  },
  css: ['~assets/css/main.css'],
  loading: { color: '#3B8070' }
}

server/index.js

const express = require('express');
const Nuxt = require('nuxt');
const nuxtConfig = require('../app/nuxt.config');

const app = express();

console.log(nuxtConfig.srcDir);

app.get('/api', (req, res) => {
  res.json('Ok');
});

const nuxt = new Nuxt(nuxtConfig);
nuxt.build();
app.use(nuxt.render);

app.listen(3000, () => {
  console.log('now listening port 3000');
});

Folder structure:

_{This bug report is available on Nuxt.js community (#c41)}

Routes transitions javascript hooks

Any way to add the javascript hooks to the <transition>?

<transition
  v-on:before-enter="beforeEnter"
  v-on:enter="enter"
  v-on:after-enter="afterEnter"
  v-on:enter-cancelled="enterCancelled"
  v-on:before-leave="beforeLeave"
  v-on:leave="leave"
  v-on:after-leave="afterLeave"
  v-on:leave-cancelled="leaveCancelled"
>
  <!-- ... -->
</transition>

Maybe we could simply add transition: { hooks: true } as a viable option in nuxt-config? And then add the same as above into <transition> (seems overkill to be able to name the hooks yourself).

Thing to watch out for though:

It’s also a good idea to explicitly add v-bind:css="false" for JavaScript-only transitions so that Vue can skip the CSS detection. This also prevents CSS rules from accidentally interfering with the transition.

_{This feature request is available on Nuxt.js community (#c27)}

can not import default in .vue files

If importing the default object of .js file in a .vue file, the default object will be wrapped.

foo.js

export default {
  bar: 123
};

some.vue

import foo from './foo';
// need to use foo.default to access the default object
console.log(foo.default.bar);

I think the problem is because vue-loader did not config the babel option: modules: false at https://github.com/nuxt/nuxt.js/blob/master/lib/build/webpack/vue-loader.config.js#L7

  let config = {
    postcss: this.options.build.postcss,
    loaders: {
      'js': 'babel-loader?presets[]=es2015&presets[]=stage-2',
      'less': 'vue-style-loader!css-loader!less-loader',
      'sass': 'vue-style-loader!css-loader!sass-loader?indentedSyntax',
      'scss': 'vue-style-loader!css-loader!sass-loader',
      'stylus': 'vue-style-loader!css-loader!stylus-loader',
      'styl': 'vue-style-loader!css-loader!stylus-loader'
    }
  }

I wonder why set the babel options here rather than use the .babelrc ?

_{This bug report is available on Nuxt.js community (#c47)}

Server-Side Data

As it stands today, is there a good way to connect to a server-side database and render pages that work without JavaScript on the client, but can progressively enhance to use JavaScript on the client if available? Essentially that would mean not exposing a rest API, but instead having some sort of data provider mechanism that doesn't leak secrets to the client.

_{This question is available on Nuxt.js community (#c50)}

window is not defined with element-ui

when we import other lib

Strange behavior with applied styles in loaded page from server

I've installed nuxt.js using vue init nuxt/starter nuxt-site, all is fine, but when the page is loaded from the server, soon I see the page without styles, which are applied a fraction of second later.

I don't think (maybe I'm wrong), but is this the right behavior? 😕

_{This question is available on Nuxt.js community (#c46)}

Eliminate external resource requests (above and below the fold)

What would you think of a nuxt.js app using making no external resource requests for it's own JS and CSS files? It would all be inline injected into lib/views/app.html

Before:

<% const {
  title, htmlAttrs, bodyAttrs, link, style, script, noscript, meta
} = context.meta.inject() %><!DOCTYPE html>
<html n-head-ssr ${htmlAttrs.text()}>
  <head>
    ${meta.text()}
    ${title.text()}
    ${link.text()}
    ${style.text()}
    ${script.text()}
    ${noscript.text()}
    <base href="<%= baseUrl %>">
    <% if (!dev) { %><link rel="stylesheet" href="<%= files.css %>"><% } %>
  </head>
  <body ${bodyAttrs.text()}>
    <%= APP %>
    <script type="text/javascript" defer>window.__NUXT__=<%= serialize(context.nuxt) %></script>
    <script src="<%= files.vendor %>" defer></script>
    <script src="<%= files.app %>" defer></script>
  </body>
</html>

After:

<% const {
  title, htmlAttrs, bodyAttrs, link, style, script, noscript, meta
} = context.meta.inject() %><!DOCTYPE html>
<html n-head-ssr ${htmlAttrs.text()}>
  <head>
    ${meta.text()}
    ${title.text()}
    ${link.text()}
    ${style.text()}
    ${script.text()}
    ${noscript.text()}
    <base href="<%= baseUrl %>">
    <% if (!dev) { %><style><%= files.css.CODE %></style><% } %>
  </head>
  <body ${bodyAttrs.text()}>
    <%= APP %>
    <script type="text/javascript" defer>window.__NUXT__=<%= serialize(context.nuxt) %></script>
    <script><%= files.vendor.CODE %></script>
    <script><%= files.app.CODE %></script>
  </body>
</html>

_{This feature request is available on Nuxt.js community (#c9)}

TypeError: Cannot read property 'path' of undefined

When I try to run the provided custom-routes example, I get the following error. I've also been able to replicate the bug in my own project by trying to use the hidden pages feature when defining routes.

TypeError: Cannot read property 'path' of undefined
    at VueRouter.match (C:\Users\Anthony\Desktop\custom-routes\node_modules\vue-router\dist\vue-router.common.js:1135:44)
    at VueRouter.resolve (C:\Users\Anthony\Desktop\custom-routes\node_modules\vue-router\dist\vue-router.common.js:2037:23)
    at Proxy.render (C:\Users\Anthony\Desktop\custom-routes\node_modules\vue-router\dist\vue-router.common.js:300:22)
    at VueComponent.Vue._render (C:\Users\Anthony\Desktop\custom-routes\node_modules\vue\dist\vue.runtime.common.js:2925:22)
    at renderComponent (C:\Users\Anthony\Desktop\custom-routes\node_modules\vue-server-renderer\build.js:5888:25)
    at renderNode (C:\Users\Anthony\Desktop\custom-routes\node_modules\vue-server-renderer\build.js:5871:7)
    at next (C:\Users\Anthony\Desktop\custom-routes\node_modules\vue-server-renderer\build.js:6007:9)
    at cachedWrite (C:\Users\Anthony\Desktop\custom-routes\node_modules\vue-server-renderer\build.js:36:9)
    at renderElement (C:\Users\Anthony\Desktop\custom-routes\node_modules\vue-server-renderer\build.js:5931:5)
    at renderNode (C:\Users\Anthony\Desktop\custom-routes\node_modules\vue-server-renderer\build.js:5875:7) 

I'm running Node version v6.9.1 on Windows 10.

_{This bug report is available on Nuxt.js community (#c34)}

Unexpected token nuxt:3

Hi today i try nuxt by running this command

vue init nuxt/starter nuxt
cd nuxt
yarn install
npm run dev

And getting this error

$ npm run dev

> [email protected] dev /home/ferri/Developments/web/nuxt
> nuxt

/home/ferri/Developments/web/nuxt/node_modules/nuxt/bin/nuxt:3
const { join } = require('path')
      ^

SyntaxError: Unexpected token {
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:373:25)
    at Object.Module._extensions..js (module.js:416:10)
    at Module.load (module.js:343:32)
    at Function.Module._load (module.js:300:12)
    at Function.Module.runMain (module.js:441:10)
    at startup (node.js:139:18)
    at node.js:974:3

This is my system

$ npm --version
3.10.9

$ yarn --version
0.15.1

OS Freya / Ubuntu 14.04 64 bit

Thanks

_{This bug report is available on Nuxt.js community (#c32)}

Allow custom port # through npm config

First off, great work so far on nuxt.js

For this issue, some documentation here:
https://docs.npmjs.com/files/package.json#config

Ideally, the package.json would then look like this:

{
  "scripts": {
    "start": "nuxt"
  },
  "config": {
    "nuxt": {
      "port": 4000
    }
  }
}

This is critical for folks who want to host multiple nuxt.js apps/sites on one server.

_{This feature request is available on Nuxt.js community (#c11)}

Using Nuxt as a middleware : TypeError: Cannot read property 'renderer' of undefined

Hello there, I'm trying to create a really basic app using Nuxt as a middleware and I got an issue when I try to access the server.
Here is the complete error message:
The message appear both in the browser and the terminal

TypeError: Cannot read property 'renderer' of undefined
   at render (/home/vincent/WebstormProjects/nuxtExpress/node_modules/nuxt/lib/nuxt.js:94:14)
   at Layer.handle [as handle_request] (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/layer.js:95:5)
   at trim_prefix (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/index.js:312:13)
   at /home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/index.js:280:7
   at Function.process_params (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/index.js:330:12)
   at next (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/index.js:271:10)
   at expressInit (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/middleware/init.js:33:5)
   at Layer.handle [as handle_request] (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/layer.js:95:5)
   at trim_prefix (/home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/index.js:312:13)
   at /home/vincent/WebstormProjects/nuxtExpress/node_modules/express/lib/router/index.js:280:7

The check in the render function in lib/nuxt.js fails because this is actually undefined.

// nuxt.js
render (req, res) {
    if (!this.renderer) { // <--- Here this is undefined
      setTimeout(() => {
        this.render(req, res)
      }, 1000)
      return
    }
    // ...

This may be caused by my code? I'm probably doing something wrong in this file.

// app.js (at project's root)
const express = require('express');
const app = express();
const Nuxt = require('nuxt');
const nuxtConfig = require('./config/nuxt.config');

new Nuxt(nuxtConfig).then((nuxt) => {
    app.use(nuxt.render);

    app.listen(3000, function () {
        console.log('listening port 3000 -> http://localhost:3000');
    });
}).catch((error) => {
    console.log(error);
});

// config/nuxt.config.js (from project's root)
module.exports = {
    build: {
        vendor: ['axios']
    }
};

<!-- pages/index.vue -->
<template>
    <div>
        <div>this is template body</div>
        <p class="ita">loaded from {{ req }}</p>
    </div>
</template>
<style>
    body{
        background-color: #f9f9f9;
        text-align: center;
    }

    p.ita {
        padding: 10px;
        font-style: italic;
    }
</style>
<script>
    export default{
        data({ req }){
            return{
                msg:'hello vue',
                req: req ? 'server' : 'client'
            }
        }
    }
</script>

Thanks, and keep up the good work! 👍

_{This bug report is available on Nuxt.js community (#c15)}

Add global css / auth-routes example

I added the "auth-routes for example" in Global CSS , "NPM run dev" did not respond. But "NPM run build & NPM run start" and "Global CSS" is the perfect addition to it. This is what reason. - love the framework very much.

_{This question is available on Nuxt.js community (#c39)}

like the nextjs,the css insert the page head

how can i add the css inside the pages/index.js like next,and then,we can create many more application in one project,but now , nuxt only add css in one style.css,so we can add many app in one project,because the css is too big to load

_{This question is available on Nuxt.js community (#c22)}

can css add inside the page

like the next.js

_{This question is available on Nuxt.js community (#c14)}

Map ./static folder to /

Default to /static/

If can be useful to change it to / when hosting robots.txt or sitemap.xml

Also move the serveStatic logic for the folder inside lib/nuxt.js, so the middleware will have the same logic.

_{This feature request is available on Nuxt.js community (#c2)}

Nuxt renderer says - renderToString is not a function

I have trying to make use of the method called nuxt.renderRoute which indeed calls renderToString which throws an error saying TypeError: self.renderToString is not a function.

All I have able to debug is

1.renderToString is a function on vue-server-renderer https://github.com/vuejs/vue/tree/dev/packages/vue-server-renderer

2. When calling this method, you pass it the context of Nuxt class and Nuxt class does not have renderToString method.

May be I am missing something?

_{This question is available on Nuxt.js community (#c37)}

Error: ENOTEMPTY: directory not empty

Using symbols (:, &, #) in nuxt.config.js stops the development server and throws an error:

I found this issue when trying to use an & in my description meta data, it only occurs when the development server is running and running yarn or npm run dev again fixes the issue and the error no longer shows.

Environment:
Nuxt 0.8.8,
Node v7.1.0

Error while rebuild the app: { Error: ENOTEMPTY: directory not empty, rmdir '/mnt/c/Users/Anthony/Documents/acook.me/.nuxt/components'
  errno: -39,
  code: 'ENOTEMPTY',
  syscall: 'rmdir',
  path: '/mnt/c/Users/Anthony/Documents/acook.me/.nuxt/components' }

_{This bug report is available on Nuxt.js community (#c49)}

Deployment not via `now`

Now is awesome, but how would we go about deploying this on an alternative server?

Is simply running the start script enough?

_{This question is available on Nuxt.js community (#c33)}

https://nuxtjs.org/ is down

@alexchopin @Atinux

Heads up -- https://nuxtjs.org/ is down.

_{This question is available on Nuxt.js community (#c25)}

Persistent state across server and client rendered pages?

Normally I'd achieve persistent state (state that doesn't expire on refresh) by using Vuex and localstorage, it seems Nuxt doesn't play nice with localstorage, I assume this is because of it's server rendering features?

Is there currently a method to get persistent state that's accessible both on the client and the server? If not, is this something that could be implemented in the future?

_{This question is available on Nuxt.js community (#c35)}

Issue with [email protected] and above

Nuxt has some difficulties since the update of [email protected], I'm looking into it.

It's due of a change in vuejs/vue@cb4854a#diff-b92dd5290072b5c2c54f2515cc1ab572R21

how can i use renderAndGetWindow for server render

hello,im find nuxt has renderAndGetWindow to get window,but i dont understand how to use it

_{This question is available on Nuxt.js community (#c42)}

How to add postcss plugins

I ended up adding them to the postcss array in vue-loader.config.js because I couldn't get it to work.

Is there a better way or should we add a hook to the postcss array?

_{This feature request is available on Nuxt.js community (#c3)}

nuxt build --watch

Seems like this should be implemented, just like webpack --watch.

_{This question is available on Nuxt.js community (#c38)}

Working with Body Request Params (req.body)

Hey guys... it's me (again)... 😆

I've been wondering on how do I, for example, receive a JSON from a POST request and put it on the request chain, in a way that I can access via some Vue component.

Is that possible?

_{This question is available on Nuxt.js community (#c19)}

Add login / authentication example

Hi, I think a lot of issues faced by Next.js apply to Nuxt.js also, and I believe that ultimately, such a feature will require a way to allow for custom server workflows, with session support etc.
Interested to discuss this.

vercel/next.js#153

_{This question is available on Nuxt.js community (#c12)}

Registering global components

Currently, to import a component to a page, I appear to have to import Vue itself, then the component (with Vue.component).

Where do I globally register components and why do I need to import Vue itself?

Apologies if these are silly questions.

_{This question is available on Nuxt.js community (#c40)}

'.vue' file extension does not automatically resolve for component imports.

For example,

import Widget from '~components/widget'

Works for...

./components/widget.js
./components/widget.json
./components/widget/index.js
./components/widget/index.json

But, not for...

./components/widget.vue 
./components/widget/index.vue

_{This feature request is available on Nuxt.js community (#c48)}

Allowing config output.publicPath of webpack (for CDN)

Currently, I see output.publicPath is automatically set to urlJoin(this.options.router.base, '/_nuxt/'). But we need to put the static assets to a CDN, something like cdn.example.com. So could you add an option in nuxt.config.js to allow us set a publicPath manually?

I and my team really like nuxt.js, it made SSR super damn easy. We are using it in our new project.
Keep on guys!

_{This feature request is available on Nuxt.js community (#c20)}

Potential to make it a PWA out of the box

I know it's very early days, and tbh i'm not even fully sure what a PWA is, but since this does SSR so from the start i wondered if the same was achievable with PWA's.

I've no idea what this entails was just an idea that popped into my head that would make nuxt sites even speedier 👍

_{This feature request is available on Nuxt.js community (#c18)}

Custom error pages

Took a look through the examples and couldn't find anything on creating/controlling error page (404, etc.)

_{This question is available on Nuxt.js community (#c31)}

Allow usage of CSS preprecessors

Not sure the best way to implement this, but just like in a normal Vue app, we should be able to do:

<style lang="sass">
@import './defaults.scss'

body
  color: $color-primary
</style>

But as expected, the build fails because of no webpack sass-loader

_{This question is available on Nuxt.js community (#c17)}

It doesn't work on windows

Here below are the log messages:

ERROR in ./~/babel-loader/lib?presets[]=es2015&presets[]=stage-2!./~/vue-loader/lib/selector.js?type=script&index=0!./.nuxt/App.vue
Module not found: Error: Can't resolve 'I:Projectscms
ode_modules
uxtlibappcomponents
uxt-error-debug.vue' in 'I:\Projects\cms\.nuxt'
 @ ./~/babel-loader/lib?presets[]=es2015&presets[]=stage-2!./~/vue-loader/lib/selector.js?type=script&index=0!./.nuxt/App.vue 7:62-141
 @ ./.nuxt/App.vue
 @ ./.nuxt/index.js
 @ ./.nuxt/client.js
 @ multi app

The main problem is that some imports / System.imports in generated code under .nuxt folder doesn't escape the directory path \:

const _eb75b49c = process.BROWSER ? () => System.import('I:\Projects\test\pages\index.vue') : require('I:\Projects\test\pages\index.vue')

import NuxtError from 'I:\Projects\test\node_modules\nuxt\lib\app\components\nuxt-error-debug.vue'

Can we use relative path and forward slash / or escape backslash in the path?

_{This bug report is available on Nuxt.js community (#c6)}

Please add the mapping params in nuxt.config.js (generate.routeParams).

When running yarn run generate i get: Could not generate the dynamic route /articles/:slug, please add the mapping params in nuxt.config.js (generate.routeParams).

I can't seem to tell from the source code and/or other projects what config i actually need for this to work.

_{This question is available on Nuxt.js community (#c26)}

Can this be used with github pages?

I'm looking into multiple static site generators and i love using Vue, would i be able to use this with github pages or would i need to deploy it somewhere like DO? :)

_{This feature request is available on Nuxt.js community (#c4)}

routes don't support "children"?

I am not sure if I understand it right:

not supporting "children" in routes means we cannot user <router-view> in vue components, and therefore means all vue files in /pages are parallel stand-alone pages and cannot be nested. Since theres is actually no "parent component" and "child component", we have no way to pass props and slots into a component in /pages. The only way to pass something in a component is via router params.

Is that correct?

_{This feature request is available on Nuxt.js community (#c16)}

src folder?

Is there a simple way to make nuxt look for everything in a ./src folder, instead of the root?

_{This feature request is available on Nuxt.js community (#c36)}

Development server crashes if `nuxt.config.js` becomes invalid

If the configuration file change during the execution of the development server, it automatically aplies the new configuration, but if the file becomes invalid (a missing comma or semicolon, we all do that sometimes!) the server crashes, needing to be restarted (after fixing the file).

When running a development server, I don't expect it to crash for any reason, no matter what happens the server should only display an error message and wait until things go back normal.

_{This feature request is available on Nuxt.js community (#c44)}

How to build from scratch

Hey guys...

It's not that clear in the docs and the project's link is broken, so I'll ask here...
Do I need to get a basic vue-cli project and then go npm i nuxt --save?

_{This question is available on Nuxt.js community (#c8)}

How can I use webpack.ProvidePlugin ?

I am trying to put semantic-ui along with the package (newbie here)

_{This question is available on Nuxt.js community (#c28)}

Add pages/_app.vue

Default:

<template>
  <nuxt></nuxt>
</template>

Can be for example: https://github.com/vuejs/vue-hackernews-2.0/blob/master/src/App.vue

And replacing:

<transition name="fade" mode="out-in">
   <router-view class="view"></router-view>
</transition>

By:

<nuxt class="view"></nuxt>

Have to register Vue.component('nuxt', 'Nuxt.vue') (actual App.vue)

What about app.error() -> app.nuxt.error(), same for app.$loading

// Nuxt.vue
created() {
  this.$root.nuxt = thi
}

BOUM 🎉

_{This feature request is available on Nuxt.js community (#c7)}

Missing deps

For some reason, just installing nuxt doesn't work.

    "ansi-regex": "^2.0.0",
    "babel-preset-es2015": "^6.18.0",
    "babel-preset-stage-2": "^6.18.0",
    "html-entities": "^1.2.0",
    "memory-fs": "^0.3.0",
    "nuxt": "^0.7.4",
    "strip-ansi": "^3.0.1"

is also required.

So lets back track here.

1. Starting with just nuxt:

$ npm i nuxt
npm WARN package.json test-foo@1.0.0 No description
npm WARN package.json test-foo@1.0.0 No repository field.
npm WARN package.json test-foo@1.0.0 No README data
npm WARN optional dep failed, continuing fsevents@1.0.15
...


nuxt@0.7.4 node_modules\nuxt
├── pify@2.3.0
├── serialize-javascript@1.3.0
├── co@4.6.0
├── es6-object-assign@1.0.3
├── ansi-html@0.0.6
├── hash-sum@1.0.2
├── vuex@2.0.0
├── vue-router@2.0.3
├── es6-promise@4.0.5
├── vue-meta@0.5.2 (object-assign@4.1.0, lodash.escape@4.0.1, lodash.isplainobject@4.0.6, deepmerge@1.3.0)
├── debug@2.3.3 (ms@0.7.2)
├── path-to-regexp@1.7.0 (isarray@0.0.1)
├── lru-cache@4.0.1 (pseudomap@1.0.2, yallist@2.0.0)
├── file-loader@0.9.0 (loader-utils@0.2.16)
├── url-loader@0.5.7 (mime@1.2.11, loader-utils@0.2.16)
├── fs-extra@1.0.0 (klaw@1.3.1, jsonfile@2.4.0, graceful-fs@4.1.11)
├── vue-template-compiler@2.1.3 (de-indent@1.0.2, he@1.1.0)
├── vue-server-renderer@2.1.3 (de-indent@1.0.2, he@1.1.0)
├── webpack-hot-middleware@2.13.2 (html-entities@1.2.0, querystring@0.2.0, strip-ansi@3.0.1)
├── cross-spawn@5.0.1 (shebang-command@1.2.0, which@1.2.12)
├── serve-static@1.11.1 (escape-html@1.0.3, encodeurl@1.0.1, parseurl@1.3.1, send@0.14.1)
├── glob@7.1.1 (path-is-absolute@1.0.1, inherits@2.0.3, fs.realpath@1.0.0, once@1.4.0, inflight@1.0.6, minimatch@3.0.3)
├── extract-text-webpack-plugin@2.0.0-beta.4 (async@1.5.2, loader-utils@0.2.16, webpack-sources@0.1.3)
├── babel-loader@6.2.8 (object-assign@4.1.0, loader-utils@0.2.16, mkdirp@0.5.1, find-cache-dir@0.1.1)
├── webpack-dev-middleware@1.8.4 (path-is-absolute@1.0.1, range-parser@1.2.0, mime@1.3.4, memory-fs@0.3.0)
├── vue@2.1.3
├── chokidar@1.6.1 (path-is-absolute@1.0.1, inherits@2.0.3, async-each@1.0.1, glob-parent@2.0.0, is-glob@2.0.1, is-binary-path@1.0.1, readdirp@2.1.0, anymatch@1.3.0)
├── vue-loader@10.0.1 (object-assign@4.1.0, vue-hot-reload-api@2.0.6, vue-style-loader@1.0.0, vue-template-es2015-compiler@1.3.0, loader-utils@0.2.16, source-map@0.5.6, postcss-selector-parser@2.2.2, consolidate@0.14.5, postcss@5.2.6, js-beautify@1.6.4)
├── css-loader@0.26.0 (postcss-modules-extract-imports@1.0.1, object-assign@4.1.0, lodash.camelcase@4.3.0, loader-utils@0.2.16, postcss-modules-values@1.2.2, source-list-map@0.1.6, babel-code-frame@6.16.0, css-selector-tokenizer@0.7.0, postcss-modules-scope@1.0.2, postcss-modules-local-by-default@1.1.1, postcss@5.2.6, cssnano@3.8.1)
├── webpack@2.1.0-beta.27 (object-assign@4.1.0, interpret@1.0.1, tapable@0.2.4, supports-color@3.1.2, ajv-keywords@1.1.1, loader-runner@2.2.0, source-map@0.5.6, loader-utils@0.2.16, mkdirp@0.5.1, enhanced-resolve@2.3.0, acorn@4.0.3, memory-fs@0.3.0, webpack-sources@0.1.3, async@2.1.4, watchpack@1.1.0, ajv@4.9.0, uglify-js@2.7.4, node-libs-browser@1.1.1, yargs@6.4.0)
├── autoprefixer@6.5.3 (normalize-range@0.1.2, num2fraction@1.2.2, postcss-value-parser@3.3.0, browserslist@1.4.0, postcss@5.2.6, caniuse-db@1.0.30000587)
├── lodash@4.17.2
├── babel-core@6.18.2 (slash@1.0.0, babel-messages@6.8.0, path-is-absolute@1.0.1, babel-template@6.16.0, babel-helpers@6.16.0, private@0.1.6, json5@0.5.0, babylon@6.14.1, convert-source-map@1.3.0, source-map@0.5.6, babel-types@6.19.0, minimatch@3.0.3, babel-code-frame@6.16.0, babel-traverse@6.19.0, babel-generator@6.19.0, babel-register@6.18.0, babel-runtime@6.18.0)
├── [email protected] ([email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected], [email protected])
└── babel-preset-stage-2@6.18.0 (babel-plugin-syntax-dynamic-import@6.18.0, babel-plugin-transform-decorators@6.13.0, babel-plugin-transform-class-properties@6.19.0, babel-preset-stage-3@6.17.0)

npm run dev

> test-foo@1.0.0 dev C:\Users\zenobius\Projects\test-foo
> nuxt

  nuxt:build App root: C:\Users\zenobius\Projects\test-foo +0ms
  nuxt:build Generating .nuxt/ files... +2ms
  nuxt:build Generating routes... +6ms
  nuxt:build Generating files... +3ms
  nuxt:build Adding webpack middlewares... +25ms
{ Error: Cannot find module 'memory-fs'
    at Function.Module._resolveFilename (module.js:469:15)
    at Function.Module._load (module.js:417:25)
    at Module.require (module.js:497:17)
    at require (internal/module.js:20:19)
    at Nuxt.webpackWatchAndUpdate (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\lib\build\index.js:250:15)
    at Nuxt.module.exports (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\lib\build\index.js:129:27)
    at next (native)
    at onFulfilled (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\co\index.js:65:19) code: 'MODULE_NOT_FOUND' }

npm ERR! Windows_NT 10.0.14393
npm ERR! argv "C:\\Program Files (x86)\\Nodist\\v-x64\\6.9.1\\node.exe" "C:\\Program Files (x86)\\Nodist\\npmv\\2.15.10\\bin\\npm-cli.js" "run" "dev"
npm ERR! node v6.9.1
npm ERR! npm  v2.15.10
npm ERR! code ELIFECYCLE
npm ERR! test-foo@1.0.0 dev: `nuxt`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the test-foo@1.0.0 dev script 'nuxt'.
npm ERR! This is most likely a problem with the test-foo package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     nuxt
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs test-foo
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!
npm ERR!     npm owner ls test-foo
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     C:\Users\zenobius\Projects\test-foo\npm-debug.log

Nope...

2. adding memory-fs

$ npm i -S memory-fs

$ npm run dev

> test-foo@1.0.0 dev C:\Users\zenobius\Projects\test-foo
> nuxt

  nuxt:build App root: C:\Users\zenobius\Projects\test-foo +0ms
  nuxt:build Generating .nuxt/ files... +2ms
  nuxt:build Generating routes... +5ms
  nuxt:build Generating files... +2ms
  nuxt:build Adding webpack middlewares... +19ms
Ready on http://localhost:3000
./.nuxt/server.js
Module build failed: Error: Couldn't find preset "es2015" relative to directory "C:\\Users\\zenobius\\Projects\\test-foo"
    at C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\options\option-manager.js:299:19
    at Array.map (native)
    at OptionManager.resolvePresets (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\options\option-manager.js:270:20)
    at OptionManager.mergePresets (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\options\option-manager.js:259:10)
    at OptionManager.mergeOptions (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\options\option-manager.js:244:14)
    at OptionManager.init (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\options\option-manager.js:374:12)
    at File.initOptions (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\index.js:216:65)
    at new File (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\index.js:139:24)
    at Pipeline.transform (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
    at transpile (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-loader\lib\index.js:41:20)
webpack built 53381c8f33547a6b069d in 740ms
Hash: 53381c8f33547a6b069d
Version: webpack 2.1.0-beta.27
Time: 740ms
               Asset     Size  Chunks       Chunk Names
      nuxt.bundle.js  23.2 kB       0       app
    vendor.bundle.js   301 kB       1       vendor
  nuxt.bundle.js.map  26.7 kB       0       app
vendor.bundle.js.map   369 kB       1       vendor

ERROR in (webpack)-hot-middleware/client.js?reload=true
Module not found: Error: Can't resolve 'strip-ansi' in 'C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\webpack-hot-middleware'
 @ (webpack)-hot-middleware/client.js?reload=true 95:14-35
 @ multi app

ERROR in (webpack)-hot-middleware/client-overlay.js
Module not found: Error: Can't resolve 'html-entities' in 'C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\webpack-hot-middleware'
 @ (webpack)-hot-middleware/client-overlay.js 40:15-39
 @ (webpack)-hot-middleware/client.js?reload=true
 @ multi app

ERROR in ./.nuxt/client.js
Module build failed: Error: Couldn't find preset "es2015" relative to directory "C:\\Users\\zenobius\\Projects\\test-foo"
    at C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\options\option-manager.js:299:19
    at Array.map (native)
    at OptionManager.resolvePresets (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\options\option-manager.js:270:20)
    at OptionManager.mergePresets (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\options\option-manager.js:259:10)
    at OptionManager.mergeOptions (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\options\option-manager.js:244:14)
    at OptionManager.init (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\options\option-manager.js:374:12)
    at File.initOptions (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\index.js:216:65)
    at new File (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\file\index.js:139:24)
    at Pipeline.transform (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
    at transpile (C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\babel-loader\lib\index.js:41:20)
 @ multi app

Which spams the terminal with errors forever until ctrl+c

3. add those missing libs

$ npm i -S html-entities ansi-regex babel-preset-stage-2 babel-preset-es2015
npm WARN package.json test-foo@1.0.0 No description
npm WARN package.json test-foo@1.0.0 No repository field.
npm WARN package.json test-foo@1.0.0 No README data
ansi-regex@2.0.0 node_modules\ansi-regex

html-entities@1.2.0 node_modules\html-entities

babel-preset-es2015@6.18.0 node_modules\babel-preset-es2015
├── babel-plugin-transform-es2015-literals@6.8.0 (babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-duplicate-keys@6.8.0 (babel-types@6.19.0, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-modules-umd@6.18.0 (babel-template@6.16.0, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-modules-amd@6.18.0 (babel-template@6.16.0, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-block-scoped-functions@6.8.0 (babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-typeof-symbol@6.18.0 (babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-computed-properties@6.8.0 (babel-template@6.16.0, babel-helper-define-map@6.18.0, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-sticky-regex@6.8.0 (babel-helper-regex@6.18.0, babel-types@6.19.0, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-template-literals@6.8.0 (babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-destructuring@6.19.0 (babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-for-of@6.18.0 (babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-shorthand-properties@6.18.0 (babel-types@6.19.0, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-modules-systemjs@6.19.0 (babel-template@6.16.0, babel-helper-hoist-variables@6.18.0, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-unicode-regex@6.11.0 (regexpu-core@2.0.0, babel-helper-regex@6.18.0, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-arrow-functions@6.8.0 (babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-modules-commonjs@6.18.0 (babel-plugin-transform-strict-mode@6.18.0, babel-template@6.16.0, babel-types@6.19.0, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-object-super@6.8.0 (babel-helper-replace-supers@6.18.0, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-parameters@6.18.0 (babel-helper-get-function-arity@6.18.0, babel-helper-call-delegate@6.18.0, babel-template@6.16.0, babel-types@6.19.0, babel-traverse@6.19.0, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-block-scoping@6.18.0 (babel-template@6.16.0, babel-types@6.19.0, babel-traverse@6.19.0, lodash@4.17.2, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-function-name@6.9.0 (babel-types@6.19.0, babel-helper-function-name@6.18.0, babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-spread@6.8.0 (babel-runtime@6.18.0)
├── babel-plugin-check-es2015-constants@6.8.0 (babel-runtime@6.18.0)
├── babel-plugin-transform-es2015-classes@6.18.0 (babel-helper-replace-supers@6.18.0, babel-helper-optimise-call-expression@6.18.0, babel-messages@6.8.0, babel-helper-function-name@6.18.0, babel-template@6.16.0, babel-helper-define-map@6.18.0, babel-types@6.19.0, babel-traverse@6.19.0, babel-runtime@6.18.0)
└── babel-plugin-transform-regenerator@6.16.1 (private@0.1.6, babel-types@6.19.0, babel-runtime@6.18.0)

babel-preset-stage-2@6.18.0 node_modules\babel-preset-stage-2
├── babel-plugin-syntax-dynamic-import@6.18.0
├── babel-plugin-transform-decorators@6.13.0 (babel-plugin-syntax-decorators@6.13.0, babel-helper-define-map@6.18.0, babel-template@6.16.0, babel-types@6.19.0, babel-helper-explode-class@6.18.0, babel-runtime@6.18.0)
├── babel-plugin-transform-class-properties@6.19.0 (babel-plugin-syntax-class-properties@6.13.0, babel-template@6.16.0, babel-helper-function-name@6.18.0, babel-runtime@6.18.0)
└── babel-preset-stage-3@6.17.0 (babel-plugin-syntax-trailing-function-commas@6.13.0, babel-plugin-transform-async-to-generator@6.16.0, babel-plugin-transform-exponentiation-operator@6.8.0, babel-plugin-transform-async-generator-functions@6.17.0, babel-plugin-transform-object-rest-spread@6.19.0)

$ npm run dev

> test-foo@1.0.0 dev C:\Users\zenobius\Projects\test-foo
> nuxt

  nuxt:build App root: C:\Users\zenobius\Projects\test-foo +0ms
  nuxt:build Generating .nuxt/ files... +3ms
  nuxt:build Generating routes... +5ms
  nuxt:build Generating files... +3ms
  nuxt:build Adding webpack middlewares... +20ms
Ready on http://localhost:3000

Boom. getting somewhere... but, without loading any pages:

ERROR in (webpack)-hot-middleware/client.js?reload=true
Module not found: Error: Can't resolve 'strip-ansi' in 'C:\Users\zenobius\Projects\test-foo\node_modules\nuxt\node_modules\webpack-hot-middleware'
 @ (webpack)-hot-middleware/client.js?reload=true 95:14-35
 @ multi app

4. install yet more missing libs

$ npm i --save strip-ansi
npm WARN package.json test-foo@1.0.0 No description
npm WARN package.json test-foo@1.0.0 No repository field.
npm WARN package.json test-foo@1.0.0 No README data
strip-ansi@3.0.1 node_modules\strip-ansi

$ npm run dev

> test-foo@1.0.0 dev C:\Users\zenobius\Projects\test-foo
> nuxt

  nuxt:build App root: C:\Users\zenobius\Projects\test-foo +0ms
  nuxt:build Generating .nuxt/ files... +3ms
  nuxt:build Generating routes... +7ms
  nuxt:build Generating files... +3ms
  nuxt:build Adding webpack middlewares... +18ms
Ready on http://localhost:3000
webpack built ee46c8438c3a8b6ffca2 in 9442ms
webpack building...
webpack built ee46c8438c3a8b6ffca2 in 86ms
  nuxt:render Rendering url / +10s
webpack building...
webpack built ee46c8438c3a8b6ffca2 in 131ms

Getting somewhere now.

$ curl http://localhost:3000
<!DOCTYPE html>
<html n-head-ssr n-head="">
  <head>

    <title n-head="true">This page could not be found.</title>




    <base href="/">

  </head>
  <body n-head="">
    <div id="__nuxt" server-rendered="true"><div><div class="progress" style="width:0%;height:2px;background-color:black;opacity:0" data-v-0cc8389e></div> <div class="error-page" data-v-5367edcf><div data-v-5367edcf><h1 class="error-code" data-v-5367edcf>404</h1> <div class="error-wrapper-message" data-v-5367edcf><h2 class="error-message" data-v-5367edcf>This page could not be found.</h2></div> <p data-v-5367edcf><a href="/" class="error-link router-link-active" data-v-5367edcf>Back to the home page</a></p></div></div></div></div>
    <script type="text/javascript" defer>window.__NUXT__={"data":[],"error":{"statusCode":404,"message":"This page could not be found.","url":"\u002F"},"serverRendered":true}</script>
    <script src="/_nuxt/vendor.bundle.js" defer></script>
    <script src="/_nuxt/nuxt.bundle.js" defer></script>
  </body>
</html>

Boom. much success. yes.

_{This question is available on Nuxt.js community (#c5)}

need a resolve.alias "~base" point to the base folder of project

I want to put the AJAX functions into a folder named "models" or "apis" or whatever. The predefined alias can't meet my needs, and everyone has his own habit, why not adding an alias pointing to the base folder?

_{This feature request is available on Nuxt.js community (#c13)}

renderToString vs renderToStream

According to the vue.js docs says:

Vue also supports rendering to a stream, which is preferred for web servers that support streaming. This allows HTML to be written to the response as it’s generated, rather than all at once at the end. The result is requests are served faster, with no downsides!

I see Nuxt is using renderToString to yield the html string. I'm interested the reason why Nuxt not using renderToStream?

_{This feature request is available on Nuxt.js community (#c21)}

Lazy loading

Is it possible to only execute certain bits of code like we can with base webpack or vue-router require.ensure, System.import? If so would this be possible after generate too?

My use case is using highlight.js but i'd only wanna load this on certain routes

_{This question is available on Nuxt.js community (#c29)}

Translation support (or get access to Vue configuration)

Hi, We are building our new app using nuxt as an Express.js middleware. Our app must be translated in some languages.

We are looking to use i18next using the i18next vuejs build.
As you can see, to use it, we need to make some Vue configuration.

Vue.use(VueParams);
Vue.use(VueI18Next);
Vue.params.i18nextLanguage = "en";
i18next.init({ lng: Vue.params.i18nextLanguage, ... });
// ...

Don't know if there is a way to add custom Vue configuration by using Nuxt ?

Many thanks :)

_{This question is available on Nuxt.js community (#c23)}