Webpack + vue-loader构建单文件vue组件

1.开始

创建下面目录：

修改package.json:

{
  "name": "vue",
  "version": "0.0.1",
  "description": "My vue",
  "author": "minixu", 
  "dependencies": {
    "vue": "^1.0.26",
    "webpack": "^1.13.1"
  },
  "devDependencies": {
    "babel-core": "^6.1.2",
    "babel-loader": "^6.1.0",
    "babel-plugin-transform-runtime": "^6.1.2",
    "babel-preset-es2015": "^6.1.2",
    "babel-preset-stage-0": "^6.1.2",
    "babel-runtime": "^5.8.0",
    "css-loader": "^0.23.0",
    "style-loader": "^0.13.0", 
   "vue-html-loader": "^1.2.3",
    "vue-loader": "^7.3.0", 
    "webpack": "^1.13.1",
    "webpack-dev-server": "^1.14.1"
  }
}

加载依赖模块：

$npm install 

如果实在下载不下来建议使用cnpm进行下载：

$npm install cnpm -g   

$cnpm install 

配置webpack.config.js:

//webpack.config.js
module.exports = {
  // 入口文件
  entry: './src/