Can vue not have the .vue suffix? I want to introduce it into an old project. What should I do?
大家讲道理2017-05-19 10:37:12
Old projects directly import vue.js files
<script src="https://unpkg.com/vue/dist/vue.js"></script>
为情所困2017-05-19 10:37:12
You can try html. But this does not conform to the syntax of vue, it will report an error
为情所困2017-05-19 10:37:12
.vue format is not the file that is ultimately introduced into the page. After being packaged by webpack, a normal js file will be generated. Just introduce this js file.
淡淡烟草味2017-05-19 10:37:12
Deploy the old project to v-cli, then reference the .vue component, and then package it with webpack
阿神2017-05-19 10:37:12
The first question is about the suffix.
The suffix has nothing to do with VUE. Vue is just a special text file, even if you use .abc.
This is all thanks to webpack. In the loaders configuration of webpack, you can give one or more loaders to the specified file. You can also think of these loaders as precompilation tools.
module: {
rules: [{
test: /\.vue$/, // 这里指定 .vue 文件通过 vue-loader 解析,你可以指定任何类型的文件。
loader: 'vue-loader',
options: vueLoaderConfig
}]
}
Second question, vue small project is similar to the usage of third-party libraries
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>vue-demo</title>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
</head>
<body>
<p id="app">
{{ message }}
</p>
</body>
<script>
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})
</script>
</html>