vue入门 - vue-cli

1 安装

  1. 首先肯定得有nodejs。
  2. shell执行$ npm i vue-cli -g全局安装vue-cli。
  3. 测试是否安装成功 $ vue -V(-V要大写,否则不识别),输出版本号则表示全局安装成功。

2 初始化项目

  1. 执行$ vue init webpack my-project创建新项目。一路回车,后面会有测试、代码检查等工具,根据需要输入y/n然后回车。
  2. 如果需要构建vue1版本的项目,则执行$ npm vue init webpack#1 my-vue1-app

3 引入jquery等js库

  由于vue-cli是直接构建出webpack打包环境,而不像angular-cli那样在外面将webpack包了起来,所以我们可以直接修改其webpack配置来达到个性化打包的目的。 
   
1.在构建的项目中build/webpack.base.conf.js的module.export对象中的resolve属性中添加:

  resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src'),
      'jquery': 'jquery'
    }
  },

2.然后在module.export对象中添加plugins属性:

    new webpack.ProvidePlugin({
      jquery: "jquery",
      $:"jquery"
    })
posted @ 2017-05-31 15:00  小白点  阅读(206)  评论(0编辑  收藏  举报