記錄使用vue-fullpage.js遇到的問題。
github地址：https://github.com/alvarotrigo/vue-fullpage.js
下載安裝
npm install --save vue-fullpage.js
index.html頁面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>resume</title>
<link rel="stylesheet">
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.5/jquery.fullpage.js"></script>
</body>
</html>
App.vue頁面
import FullPage from 'vue-fullpage.js/src/FullPage'
export default {
name: 'App',
data () {
return {
options: {
paddingTop: '30px'
}
}
},
components: {
FullPage
}
}
會遇到一個(gè)報(bào)錯(cuò)信息
Couldn't find preset "es2015" relative to directory "E:\\Workspaces\\vscode\\resume\\node_modules\\vue-fullpage.js"
安裝babel-preset-es2015就解決
npm install babel-preset-es2015
其他問題可能的解決方案
參考：https://github.com/alvarotrigo/vue-fullpage.js/issues/4
build/webpack.base.conf.js中修改配置
{
test: /\.js$/,
loader: 'babel-loader',
include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client'),resolve('node_modules/vue-fullpage.js/src/fullPageMixin.js')]
},
增加fullPageMixin時(shí)報(bào)錯(cuò)
import fullPageMixin from 'vue-fullpage.js/src/fullPageMixin'
解決方法
plugins: [
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false,
drop_console: false,
}
})
],
