使用webpack工具打包vue+es6项目现在是前端很火的一个技术。今天大体介绍下自己在搭建过程中的问题:
步骤:在cmd命令行下操作
1.安装nodejs , 路径:www.nodejs.org,一路默认安装即可,目前最新的nodejs包已经涵盖了npm,所以不用另行安装npm;
2.安装cnpm,为了加快安装速度,我们可安装淘宝镜像服务器,对我们所依赖的modules进行安装;
npm install -g cnpm --registry=https://registry.npm.taobao.org
3.接着安装全局的vue-cli脚手架,用于帮助搭建所需的模板框架;
cnpm install -g vue-cli
安装完成后输入vue回车,确认是否安装成功;
4.找到合适的位置创建自己的项目文件夹
例如在f盘下创建:
f: //进入f盘
mkdir myvue //创建项目文件夹
cd myvue //进入文件夹
vue init webpack my-vue //自定义文件夹安装webpack
5.cd进入文件夹,通过命令
cnpm install //安装依赖
6.cnpm run dev,运行项目,在浏览器窗口打开localhost:8080即进入了你的项目.
注意事项:本人在搭建过程中在win10系统下,按照以上步骤一次性成功,在win7环境下,测试好多次都安装失败,
这时需要打开 nodejs自带的Node.js command prompt命令行,
- npm install -g vue-cli
- vue init webpack my-project
- npm install
- npm run dev
- (注意这四个步骤省略了文件夹的切换语句),这样在win7下就可以正常搭建成功了!
时间: 2024-11-01 15:35:42