Question

我正在尝试使用下一个无服务器的应用程序来构建应用程序，但我的页面不是在预期的文件夹（next/serverless/pages/中输出JS文件，而是变为静态HTML文件，在构建时nextjs甚至是这样；

Compiled successfully. 

Page            Size     Files  Packages                                                                                
┌   /_app       2.04 kB    195         0                                                                                
├   /_document                                                                                                          
├   /_error     7.58 kB    230         0                                                                                
├ ⚡ /About      420 B      196         0                                                                                
└ ⚡ /Index      420 B      196         0                                                                                                                                                                                                        
λ  (Lambda)       page was emitted as a lambda (i.e. getInitialProps)                                                   
⚡  (Static File)  page was prerendered as static HTML

这是我的next.config.js：

module.exports = {
  target: "serverless",
  distDir: "../../dist/functions/next"
};

具有两个页面（About和Index）的构建的输出为：

dist/functions/next/serverless/pages/
  _error.js
  404.html
  About.html
  Index.html

我需要将它们作为JS文件，因为以后需要它们作为模块通过Firebase函数进行HTTP请求

Answer 1

从Next.js 9开始，在进行静态导出时，默认情况下使用Automatic Static Optimization。

静态HTML .html的性能很好，但是出于某些原因，如果您希望将某些文件导出为.js，则Next.js 9也支持该partial static export。

只需在要导出为getInitialProps的页面中包含.js，然后它就会输出javascript文件而不是HTML文件。

class Index extends Component {

  // just have to add this line into any of your `pages/any-file.js`
  static getInitialProps(ctx) {
    return {};
  }

  render() {
    return (
      <div>
        <h1>Index Page</h1>
      </div>
    );
  }
}

export default Index;

NextJs使用静态HTML文件而不是lambdas构建无服务器应用程序

1 个答案: