vue -- element-UI 初次教程 ico autoOpen

正式开发vue页面 第一课

 前面有详细安装步骤 、初始化项目

 

 

npm i element-ui -S

src--》main.js

import ElementUI from 'element-ui' import 'element-ui/lib/theme-chalk/index.css' Vue.use(ElementUI)

 

 

 

 

 

初始化页面

 

 

 

<el-button size="small" @click="go()">查询</el-button>

router

import v from '@/page/v' export default new Router({ routes: [ { path: '/v', name: 'v', component: v } ] })

 

<script> export default { name: 'HelloWorld', data () { return { msg: 'Welcome to Your Vue.js App' } }, created() { this.msg='Welcome to king' }, methods: { go(){ this.$router.push({ name: 'v', params: { data: true } }) } } } </script> export default { name: 'v', data () { return { msg: 'Welcome to king Vue.js App' } }, created() { this.msg=this.$route.params.data } } </script>

接收传过来的值

 

二、vue 项目中，配置图标和文字

1. 在网站根目录下的 index.html 文件的title 标签中添加标题栏文字

2. 将图片.ico 文件放在网站根目录下

3. 修改 build 文件夹下 webpack.prod.conf.js 和 webpack.dev.conf.js 文件

 

new HtmlWebpackPlugin({ filename: 'index.html', template: 'index.html', favicon: path.resolve('king.ico'), inject: true }),

 

自动加载浏览器

host: '127.0.0.1', // can be overwritten by process.env.HOST port: 8521, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined autoOpenBrowser: true, errorOverlay: true, notifyOnErrors: true, poll: false, // https

  autoOpenBrowser: true,