# npm install
npm i vant -S
# main Introducing Vant
Write the following in main.js:
import Vue from 'vue'
import App from './App'
import router from './router'
import Vant from 'vant';
import 'vant/lib/index.css';
Vue.use(Vant);
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
});
# cnd Introducing Vant
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>chenbz</title>
<!-- 引入 vant 样式 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/lib/index.css">
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
<!-- 引入 vant 组件 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/lib/vant.min.js"></script>
</body>
</html>
Add externals to build / webpack.base.config.js in the root directory
......
module.exports = {
......,
externals: {
'vue' : 'Vue',
'vant' : 'vant',
}
};
# Main introduction and cnd introduction only need to choose one (recommended cnd introduction)
# Start using it happily
