代码拉取完成,页面将自动刷新
同步操作将从 flatfish/Java-Review 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
说明
Vue环境安装的彩坑
环境安装:
npm ERR! code EEXIST!
参考文章: https://blog.csdn.net/qq_42582489/article/details/107396963
创建vue项目
// HelloWorld.vue
<template>
<div>
<p class="msg">{{msg}}</p>
</div>
</template>
<script>
// 配置对象与Vue一致
export default {
// 必须写函数
data () {
return {
msg: 'hello Vue component'
}
}
}
</script>
<style>
.msg {
color: red;
font-size: 30px;
}
</style>
// App.vue
<template>
<div>
<img class="logo" src="./assets/logo.png" alt="logo">
<!--第三步,使用标签组件-->
<HelloWorld>
</HelloWorld>
</div>
</template>
<script>
// 第一步,引入组件
import HelloWorld from './components/HelloWorld'
export default {
//第二步,映射组件标签
components: {
HelloWorld
}
}
</script>
<style>
.logo{
width:200px;
height: 200px;
}
</style>
/**
* 入口js,创建Vue实例
*/
import Vue from 'vue'
import App from './App.vue'
new Vue({
el: '#app',
components: {
App
},
template: '<App/>'
})
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>vue_demo2</title>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
打包
发布1:使用静态服务器工具包
发布2:使用Web服务器(Tomcat)
output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].[chunkhash].js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js'),
// 添加以下内容
publicPath: '/vue_demo02/'
},
说明
ESLint 提供以下支持
ESLint 提供以下几种校验
规则的错误等级有三种
相关配置文件
.eslintrc.js : 全局规则配置文件
'rules': {
'no-new': 1
}
在 js/vue 文件中修改局部规则
/* eslint-disable no-new */
new Vue({
el: 'body',
components: { App }
})
.eslintignore: 指令检查忽略的文件
*.js
*.vue
修改配置文件 webpack.base.conf.js
module: {
rules: [
// 把下面的这个注释掉
// ...(config.dev.useEslint ? [createLintingRule()] : []),
{}
详情请看代码
组件之间通信的三种方式
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。