Vue 基础项目
Posted 小伍
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Vue 基础项目相关的知识，希望对你有一定的参考价值。
package.json
{
"private": true,
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --config=webpack.config.js"
},
"devDependencies": {
"axios": "^0.19",
\'vue\' => \'^2.5.17\',
"cross-env": "^7.0",
"lodash": "^4.17.19"
}
}index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Hello Vue</title>
<script src="js/app.js" defer></script>
<link href="css/app.css" rel="stylesheet">
</head>
<body>
<div id="app">
<example-component></example-component>
</div>
</body>
</html>src/js/bootstrap.js
window._ = require(\'lodash\');
window.axios = require(\'axios\');
window.axios.defaults.headers.common[\'X-Requested-With\'] = \'XMLHttpRequest\';src/js/app.js
require(\'./bootstrap\');
window.Vue = require(\'vue\').default;
/**
* The following block of code may be used to automatically register your
* Vue components. It will recursively scan this directory for the Vue
* components and automatically register them with their "basename".
*/
// const files = require.context(\'./\', true, /\\.vue$/i)
// files.keys().map(key => Vue.component(key.split(\'/\').pop().split(\'.\')[0], files(key).default))
Vue.component(\'example-component\', require(\'./components/ExampleComponent.vue\').default);
const app = new Vue({
el: \'#app\',
});src/js/components/ExampleComponent.vue
<template>
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">Example Component</div>
<div class="card-body">
I\'m an example component.
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
mounted() {
console.log(\'Component mounted.\')
}
}
</script>以上是关于Vue 基础项目的主要内容，如果未能解决你的问题，请参考以下文章