注意:此处没讲webpack的配置

1.  确立项目所需要的所有依赖、框架(比如bootstrap,vue,angular等)

2. 在项目的根目录下创建一个package.json文件,package.json文件是项目的最重要文件之一,下面是我的一个项目中得依赖文件:

{
"name": "element-starter",
"description": "A Vue.js project",
"author": "yi.shyang@ele.me",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --hot --env.dev",
"build": "rimraf dist && webpack -p --progress --hide-modules"
},
"dependencies": {
"element-ui": "^1.3.1",
"font-awesome": "^4.7.0",
"vue": "^2.1.8",
"echarts": "^3.3.2"
},
"engines": {
"node": ">=6"
},
"devDependencies": {
"autoprefixer": "^6.6.0",
"axios": "^0.16.1",
"babel-core": "^6.24.1",
"babel-loader": "^6.4.0",
"babel-preset-vue-app": "^1.2.0",
"css-loader": "^0.27.0",
"file-loader": "^0.10.1",
"html-webpack-plugin": "^2.24.1",
"postcss-loader": "^1.3.3",
"rimraf": "^2.5.4",
"style-loader": "^0.13.2",
"url-loader": "^0.5.8",
"vue": "^2.3.2",
"vue-loader": "^11.1.4",
"vue-router": "^2.5.3",
"vue-template-compiler": "^2.2.6",
"webpack": "^2.4.1",
"webpack-dev-server": "^2.4.2"
}
}

3.  在命令行工具中使用 npm install   命令进行依赖安装,(可以使用  cnpm  提高安装速度)这时你会发现,项目的根目录下多了一个node_modules文件夹,那里面就是从npm远程库里下载的模块然后“安装”到你的项目中的。
现在,你就可以在你的项目中应用你依赖的这些modules了。你可以通过require关键字来使用他们。

const qs = require('querystring');

4. 接下来就根据你所使用的前端框架进行项目搭建与编写,

5.  如果你是打开一个现成的项目,首先你需要安装依赖参考第 3 步,  然后在命令行工具中使用  npm  run 来启动项目, 如果启动失败,就看package.json文件里面的script里面设置的启动命令,  比如:

 "scripts": {
"dev": "webpack-dev-server --inline --hot --env.dev",
"build": "rimraf dist && webpack -p --progress --hide-modules"
},

上面的项目我就需要使用  npm run dev  启动

node项目的基本构建流程或者打开一个node项目的流程的更多相关文章

  1. Node.js npm基础安装配置&创建第一个VUE项目

    使用之前,我们先来明白这几个东西是用来干什么的. node.js: 一种javascript的运行环境,能够使得javascript脱离浏览器运行.Node.js的出现,使得前后端使用同一种语言,统一 ...

  2. 《ASP.NET MVC 5 破境之道》:第一境 ASP.Net MVC5项目初探 — 第一节:运行第一个MVC5项目

    第一境 ASP.Net MVC5项目初探 — 第一节:运行第一个MVC5项目 创建一个MVC项目,是很容易的,大部分工作,VS都帮我们完成了.只需要按照如下步骤按部就班就可以了. 打开VS2017,选 ...

  3. 自制工具:迅速打开一个Node 环境的Playground

    需求 经常有这种情况,写代码的时候需要实验种想法,亟需一种playground 环境来玩耍.如果是前端的话可以打开chrome 的控制台,但是如果是Node 的话就比较麻烦了.我要打开我的存放试验代码 ...

  4. 33.IDEA + maven]在IDEA中打开一个maven项目,resolve完依赖后,缺少部分jar包问题

    转自:https://www.cnblogs.com/zazalu/p/7649590.html [注意]作者只是对使用过程中遇到的问题提出了一个解决方案,但是本人在编写此解决方案文章的时候,对mav ...

  5. 打开一个vue项目

    1.cmd打开命令行工具 2.cd定位到目录 3.(sudo) cnpm install安装((sudo)npm install -g cnpm --registry=http://registry. ...

  6. Node.js+Express框架+Mongo学习(一)第一个node.js实例

    1.在桌面新建一个空的文件夹,比如叫node,当然也可以在其它地方新建. 2.命令行进入到所新建的文件夹的目录,下载Express框架,再在这个文件夹里新建一个叫final的项目 3.在项目(fina ...

  7. maven学习(1)下载和安装和初步使用(手动构建项目和自动构建项目)

    1:背景 关于项目的搭建,有些人使用开发工具搭建项目,然后将项目所依赖第三方jar 复制到类路径下面,上述搭建方式没有第三方类库的依赖关系,在导入一个jar包的时候,这个jar包还可能依赖其他jar包 ...

  8. PyCharm 的初始设置2 - 打开、新建项目

    03. 新建/打开一个 Python 项目 3.1 项目简介 开发 项目 就是开发一个 专门解决一个复杂业务功能的软件 通常每 一个项目 就具有一个 独立专属的目录,用于保存 所有和项目相关的文件 – ...

  9. 使用Jenkins进行android项目的自动构建(5)

    之前在项目中引入的单元测试使用的是JUnit,可以在构建前进行测试,这里在介绍一下使用Instrumentation 进行单元测试.使用Instrumentation进行测试,比之前多一些步骤,需要把 ...

随机推荐

  1. 通过 U 盘启动重装 macOS 系统

    重装系统是工作和生活中经常需要做的事情,作为一名开发人员,学会该技能你才是一名合格的程序猿!以后再也不会遇到"程旭元你会装系统吗?"的尴尬了!本文主要介绍怎样通过U盘启动重新安装 ...

  2. Webgis开源解决方案之环境搭建(三)

    前两篇文章介绍了开源GIS服务器Geoserver的安装以及开源数据库Postgres的安装,这篇文章介绍开源前端udig软件的安装,使用在后续篇幅中介绍 开源前端目前主流的是QGIS或者udig,网 ...

  3. Python之函数知识

    Python函数分类 a,内置函数 b,自定义函数 c,导入函数 一个函数就相当于一个功能块,比如获取数据库,更新数据库,函数其实就是代码的分块,调用函数来执行代码块 一块就代表一个功能 内置函数有以 ...

  4. FileZilla可以连接但是传输文件失败

    在linux本地创建文件夹后,用FileZilla传输文件失败了. 如果用的是普通用户,创建的文件夹是属于root用户.所以不能传输,没有权限. 修改权限:sudo chown -R lishengn ...

  5. JavaScript算法 ,Python算法,Go算法,java算法,系列之【归并排序】篇

    常见的内部排序算法有:插入排序.希尔排序.选择排序.冒泡排序.归并排序.快速排序.堆排序.基数排序等.用一张图概括: 归并排序(英语:Merge sort,或mergesort),是创建在归并操作上的 ...

  6. redis-key相关命令

    本篇主要介绍和redis的key进行操作的相关命令. 命令 描述 复杂度 返回值 DEL key [key ...] 删除给定的一个或多个 key .不存在的 key 会被忽略.删除单个列表.集合.有 ...

  7. SpringData系列二 Repository接口

    本节主要介绍Repository接口规范,及其子接口 Repository是一个空接口,即标准接口 若我们定义的接口继承了Repository,则该接口会被IOC容器识别为一个Repositoty B ...

  8. WARN Session 0x0 for server null, unexpected error, closing socket connection and attempting reconnect (org.apache.zookeeper.ClientCnxn)

    [2017-05-19 13:32:14,933] INFO Waiting for keeper state SyncConnected (org.I0Itec.zkclient.ZkClient) ...

  9. C#的内存管理原理解析+标准Dispose模式的实现

    本文内容是本人参考多本经典C#书籍和一些前辈的博文做的总结 尽管.NET运行库负责处理大部分内存管理工作,但C#程序员仍然必须理解内存管理的工作原理,了解如何高效地处理非托管的资源,才能在非常注重性能 ...

  10. Java中的栈上分配

    博客搬家自https://my.oschina.net/itsyizu/blog/ 什么是栈上分配 栈上分配是java虚拟机提供的一种优化技术,基本思想是对于那些线程私有的对象(指的是不可能被其他线程 ...