怎么在webpack中使用脚手架vue-cli工程-创新互联

这篇文章给大家介绍怎么在webpack中使用脚手架vue-cli工程，内容非常详细，感兴趣的小伙伴们可以参考借鉴，希望对大家能有所帮助。

webpack的打包依赖于它的一个重要配置文件webpack.config.js，在这个配置文件中就可以指定所有在源代码编译过程中的工作了，就一个配置就可以与冗长的Gruntfile或者Gulpfile说再见了。

一个完整的工程项目中的webpack的配置远远没有这么简单，随着工程的构建要求的增加，webpack.config.js内的配置项目也会随之增加，webpack还有许许多多的选项提供给我们进行灵活配置，它只是一个构建工具，我们只需要了解在Vue项目中它基本能为我们做到的工作、最小化的配置是如何的就足够了，在以后需要对它进行扩展与优化时，带着问题去查官方文档也是非常容易的事。

●  样式表引用

某些页面或者组件可能具有特定的样式定义，这些样式对于其他页面来说是冗余的，我们只希望这些组件在应用时才自动加载这些特定的样式，此时用webpack我们就能在源代码中加入以下代码来动态加载CSS：

import Vue from 'vue'
// ... 省略
// 引用指定的样式源文件
import './app/assets/less/dark.less'
export default {
 // ... 省略
}

此时我们只需要在webpack的配置中加入less-loader，那么webpack在打包的时候就会自动将less转换为CSS，并将CSS的动态代码生成到JS文件中。当Vue组件被加载到页面并实例化后，将在DOM内插入这个特定的行内样式