雅荷心语博客首先 nuxt.config.js 中的 build 配置
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
build: { analyze: true, assetFilter: function (assetFilename) { return assetFilename.endsWith('.js'); }, filenames: { app: ({ isDev }) => isDev ? '[name].js' : 'js/[name].[contenthash].js', chunk: ({ isDev }) => isDev ? '[name].js' : 'js/[name].[contenthash].js' }, components: false, extend(config, { isDev, isClient }) { config.externals = { 'element-ui': 'ELEMENT', 'vue': 'Vue' } } } |
header 中增加 script
|
1 2 3 4 5 6 7 8 |
link: [ { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }, { rel: 'stylesheet', href: 'https://cdn.bootcdn.net/ajax/libs/element-ui/2.15.14/theme-chalk/index.min.css' } ], script: [ { src: 'https://cdn.bootcdn.net/ajax/libs/vue/2.7.14/vue.min.js', type: 'text/javascript'}, { src: 'https://cdn.bootcdn.net/ajax/libs/element-ui/2.15.14/index.min.js', type: 'text/javascript' } ] |
插件中的 element 插件也要保留;
|
1 2 3 4 |
import Vue from 'vue'; import ElementUI from 'element-ui'; import('element-ui/lib/theme-chalk/index.css'); Vue.use(ElementUI); |
解决刷新页面后渲染出源代码问题
<div class=”cloak” v-cloak></div>
<style>
[v-cloak]{display: none;}
</style>
