The old fetch was commonly used for Vuex initializing. This is still apparent when looking at the description of fetch on the Vuex guide page.

The fetch method is used to fill the store before rendering the page, it's like the asyncData method except it doesn't set the component data.

However, when clicking the link to the fetch API page inside the guide, you get shown the new fetch which modifies component data directly. There is no sign of any Vuex examples there and the usage is quite unclear. In fact the description on the Vuex guide page matches that on the fetch API page under the old fetch. This might encourage implementing logic based on old fetch. Someone who is starting out might get confused at this point as there is no clear path for setting up Vuex and initializing it with asynchronous data on the client side.

My suggestion would be either expanding the fetch documentation on the Vuex store guide page or adding an example for Vuex usage on the fetch API page.

What problem does this feature solve?

Let's say I use a nuxt-based app as a testbed for some @my-name-space/** packages. I've created a nuxt-based app and added @my-name-space as a root folder, under which I store all the stuff I want to use in my testbed.

I want imports like import MyStuff from @my-name-space/some/Stuff work. So, I need to update jsconfig.json, tsconfig.json, and most importantly to extend my nuxt.config.js with the following code:

{
 /*
  ** Build configuration
  */
  build: {
    /*
    ** You can extend webpack config here
    */
    extend (config, ctx) {
      // allow @my-name-space imports
      config.resolve.alias['@my-name-space'] = config.resolve.alias['~'] + '/@my-name-space'
    }
  }

With some trial & error I managed to achieve the desired result. Wouldn't it be nice to have a documentation entry so the next guy with the same goal in mind could save some time?

What does the proposed changes look like?

A new documentation entry, titled something like "adding import path aliases".

Hi,
I just noticed the Nuxt Doc was updated (haven't used in a little bit)to use a bottom Navigation bar on mobile and there's an issue on iPhone X. The bar does not respect the safe-area-inset for the home indicator.

Official website add autoprefixer . but autoprefixer doesn't work.
build: {
postcss: {
// 添加插件名称作为键，参数作为值
// 使用npm或yarn安装它们
plugins: {
'postcss-pxtorem': {
remUnit: 75
},
},
preset: {
// 更改postcss-preset-env 设置
autoprefixer: { grid: true }
}
}
}

What problem does this feature solve?

As a new Nuxt user, I found the configuration sections quite inconsistent:

• some show the full config from export default { thing: { ... } } others just the block { ... }
• some say "nuxt.config.js" others don't
• some give full explanations, others don't

In the html.minify section, because there was no "full" example, I buggered about with various examples: 'html.minify': { ... }, html: { minify: {} }, and because of other docs online even htmlMinify but none seemed to work.

• https://nuxtjs.org/api/configuration-build/#html-minify
• https://github.com/kangax/html-minifier

There there was code online and in the source about Nuxt's generate script and associated config (other than build).

Then I found out html minifier was a module, and needed to be included. When I added them, the feature half-worked:

• https://twitter.com/TheAlexLichter/status/1242034384913477637
• https://github.com/nuxt-community/html-minifier-module/issues/31

As a new (but advanced) user, it's frustrating to thrash around on the margins but see intermittent progress.

Having sections like these fully documented and tested is critical.

What does the proposed changes look like?

Deciding what would be a good format:

• file name
• config format
• examples
• dependencies (if relevant)

and sticking to it.

Perhaps also having some way to review the docs / releases to see what should be updated.

Reproduction link

https://nuxtjs.org/faq/nginx-proxy/#using-nginx-with-generated-pages-and-a-caching-proxy-as-fallback

Steps to reproduce

Apply this Nginx conf with an non-commercial Nginx service.

What is expected ?

Nginx should start up

What is actually happening?

Get this error:
nginx: [emerg] unknown directive "proxycachepurge" in /etc/nginx/conf.d/default.conf

Additional comments?

I would just recommend that you update the document to state that and Nginx commercial license is required as stated here: http://nginx.org/en/docs/http/ngx_http_proxy_module.html#proxy_cache_purge

This relates to the nginx-proxy.md example.

I am weighing up the difference between

• serving the app via npm run start with Nginx pointing to it as the document describes, or
• just serving up the dist folder behind Nginx.

Since I'm using Docker containers, I would like to try and just serve this web app up with one container instead of 2 for scaling purposes.

My application is a PWA that simply fetches, caches and displays data with some minor additional functionality.

Are there cons to serving it up behind Nginx only?

I have tested it behind Nginx only and everything works fine, but I don't know if there's any additional logic that serving it up via node provides.

The new Nginx (without all my API reverse proxies) looks like:

server {
    listen 80;
    server_name my.domain.name;

    gzip            on;
    gzip_types      text/plain application/xml text/css application/javascript;
    gzip_min_length 1000;
    location / {
        root               /usr/local/static/;
        index              index.html;
    }
}

On the docs provided here https://nuxtjs.org/api/configuration-loading-indicator
It states that

The property can have 3 different types: string or false or object. If a string value is provided it is converted to object style.
Default value is:

{
name: 'circle',
color: '#3B8070',
background: 'white'
}

but the object name is not provided.

Version

2.9.2

Reproduction link

https://nuxtjs.org/guide/modules#run-tasks-on-specific-hooks

Steps to reproduce

The link to Hookable is broken, because this file was removed in v2.9.2 while replacing the solution with Hable

What is expected ?

Working link, with a list of available hooks.

What is actually happening?

404

Version

2.11.x

Reproduction link

https://nuxtjs.org/examples/i18n

Steps to reproduce

In a browser, go to Internationalization (i18n) => Sandbox not found

What is expected ?

Sandbox should be loaded on this page.

What is actually happening?

"Not Found
We could not find the sandbox you're looking for."

Version

2.11.x

Reproduction link

https://nuxtjs.org/examples/custom-loading/

Steps to reproduce

In a browser, go to Custom Loading Component is showing error:

What is expected ?

Example of Custom Loading Component should be displayed

What is actually happening?

Error message:

"Not Found
We could not find the sandbox you're looking for."

is displayed.

Version

v2.3.4

Reproduction link

https://codesandbox.io/s/github/nuxt/nuxt.js/tree/dev/examples/i18n?from-embed

Steps to reproduce

1. Access https://nuxtjs.org/examples/i18n/
2. Try to access the codesandbox example

What is expected ?

I expect to be able to play around with the example and see the source code.

What is actually happening?

Codesandbox return a 403 Forbidden.

可以在官网中输入下面代码进行测试：
上传一个20MB左右的文本文件，解析速度很慢在7s以上，正常解析速度在150ms左右。

function readFile(file){
let fileReader = new FileReader();
fileReader.onload = (e) => {
let t1 = new Date().getTime();
let decodeLog = e.target.result;
decodeLog.split(/\r\n|\r|\n/);
console.log("elapse:"+(new Date().getTime()-t1))
};
fileReader.readAsText(file)
}

let inp = document.createElement("input");
inp.type="file";
inp.innerText="upload";
inp.onchange = function(event){readFile(event.target.files[0])};
inp.style.position="absolute";
inp.style.top=0;
inp.style.zIndex=10000;
document.body.append(inp);

可以在官网中输入下面代码进行测试：
上传一个20MB左右的文本文件，解析速度很慢在7s以上，正常解析速度在150ms左右。

function readFile(file){
let fileReader = new FileReader();
fileReader.onload = (e) => {
let t1 = new Date().getTime();
let decodeLog = e.target.result;
decodeLog.split(/\r\n|\r|\n/);
console.log("elapse:"+(new Date().getTime()-t1))
};
fileReader.readAsText(file)
}

let inp = document.createElement("input");
inp.type="file";
inp.innerText="upload";
inp.onchange = function(event){readFile(event.target.files[0])};
inp.style.position="absolute";
inp.style.top=0;
inp.style.zIndex=10000;
document.body.append(inp);

可以在官网中输入下面代码进行测试：
上传一个20MB左右的文本文件，解析速度很慢在7s以上，正常解析速度在150ms左右。
`
function readFile(file){
let fileReader = new FileReader();
fileReader.onload = (e) => {
let t1 = new Date().getTime();
let decodeLog = e.target.result;
decodeLog.split(/\r\n|\r|\n/);
console.log("elapse:"+(new Date().getTime()-t1))
};
fileReader.readAsText(file)
}

let inp = document.createElement("input");
inp.type="file";
inp.innerText="upload";
inp.onchange = function(event){readFile(event.target.files[0])};
inp.style.position="absolute";
inp.style.top=0;
inp.style.zIndex=10000;
document.body.append(inp);`

What problem does this feature solve?

Currently there's no guidance on what decision to make for an integrated server-side framework on this page:
https://nuxtjs.org/guide/installation#using-code-create-nuxt-app-code-

Although I wouldn't expect there to be full coverage of each, it'd be nice if there was a quick one or two lines per framework, but more importantly some guidance on when/where it is appropriate to use the Nuxt default server and when not to.

Folks are asking on my gist whether or not they need express, and can host with just the default server on production. But I have no idea.
https://gist.github.com/benmccallum/226ae1b428157b9d5998a5ba27eadf59

I think it's a common scenario where people use Vue/Nuxt but aren't node developers, I'm certainly not one, so we need some help here to make this setup process smooth.

What does the proposed changes look like?

Quick pros/cons for each framework.
Pros/cons for nuxt default server and when/where it's appropriate/not.

It looks like the render:routeContext hook documented in https://nuxtjs.org/api/internals-renderer#hooks is no longer working. It should be named vue-renderer:ssr:context instead.

cf. https://github.com/nuxt/nuxt.js/commit/29297160a1f82f9d5ed882f239552892f92c705c

Version

*

Reproduction link

https://ru.nuxtjs.org/

Steps to reproduce

Open https://ru.nuxtjs.org/ through Russian ISP

What is expected ?

https://ru.nuxtjs.org/ will successfully open

What is actually happening?

https://ru.nuxtjs.org/ site does not open.

Additional comments?

Due to the fact that local law enforcement agencies are trying to block Telegram messenger, many subnets of large hosting providers were blocked in Russia. The current IP address of the server with Russian-language documentation is on the blocking list.

Is it possible to use another server to host Russian-language documentation? You can check the IP blocking at the following address https://eais.rkn.gov.ru/