使用next.js
<p>全局安装next.js</p><p>npm install -g create-next-app</p>
<p> </p>
<p>创建项目</p>
<p>npx create-next-app “项目名称“</p>
<p> </p>
<p>引入.css文件</p>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 0, 0, 1)">可引入.css文件
安装 yarn add @zeit</span>/next-<span style="color: rgba(0, 0, 0, 1)">css
配置文件 next.config.js
</span><span style="color: rgba(0, 0, 255, 1)">const</span> withCss = require(<span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">@zeit/next-css</span><span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(0, 0, 0, 1)">)
</span><span style="color: rgba(0, 0, 255, 1)">if</span>(<span style="color: rgba(0, 0, 255, 1)">typeof</span> require !== <span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">undefined</span><span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(0, 0, 0, 1)">){
require.extensions[</span><span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">.css</span><span style="color: rgba(128, 0, 0, 1)">'</span>]=file=><span style="color: rgba(0, 0, 0, 1)">{}
}
module.exports </span>= withCss({})</pre>
</div>
<p> </p>
<p>按需加载</p>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 0, 0, 1)">按需加载
yarn add babel-plugin-import</span><span style="color: rgba(0, 0, 0, 1)">
根目录下 配置文件 .babelrc
{
</span><span style="color: rgba(128, 0, 0, 1)">"</span><span style="color: rgba(128, 0, 0, 1)">presets</span><span style="color: rgba(128, 0, 0, 1)">"</span>: [<span style="color: rgba(128, 0, 0, 1)">"</span><span style="color: rgba(128, 0, 0, 1)">next/babel</span><span style="color: rgba(128, 0, 0, 1)">"</span>],<span style="color: rgba(0, 128, 0, 1)">//沿用之前的next/bable的设置</span>
<span style="color: rgba(128, 0, 0, 1)">"</span><span style="color: rgba(128, 0, 0, 1)">plugins</span><span style="color: rgba(128, 0, 0, 1)">"</span><span style="color: rgba(0, 0, 0, 1)">: []
}</span></pre>
</div>
<p> </p><br><br>
来源：https://www.cnblogs.com/chz1905/p/13553792.html
頁:
[1]