04 使用脚手架创建vue项目并启动

在安装了相关工具之后,我们现在就可以创建一个分模块的vue项目了。

1、前提约束

完成nodejs,vue-cli,webpack,webpack-dev-server的安装
https://www.jianshu.com/p/eb4d9e132f62

2、打开命令行,执行以下命令

vue init webpack vue-multymodule   回车,等待几分钟【取决于网络】
cd vue-multymodule    进入该项目
npm install    安装所需包,等待几分钟【取决于网络】
npm run dev     启动项目,等待几分钟【取决于网络】

以下是项目结构:
项目结构

3、在浏览器中输入提示的url

http://localhost:8080

4、使用idea或者webstorm打开刚才创建的项目【注意,第一次要在开发工具中配置node路径】,按以下图示操作:

打开npm脚本
执行
以上的执行等价于在命令行中执行 “npm run dev”。

5、测试,在浏览器中输入http://localhost:8080,得到以下结果

执行结果
以上就是创建一个项目模板,分贝在命令行和idea中启动的过程。

猜你喜欢

转载自www.cnblogs.com/alichengxuyuan/p/12558546.html