下载Nodejs ——> 安装Nodejs(注意安装文件的位置以及环境变量) ——> 安装淘宝镜像(不建议跳过此步) ——> 安装webpack(建议管理员身份运行) ——> 用webpack进行js打包(关于映射部分再说) ——> 用loader打包css(再说)
nvm在那个步骤进行还未测试。
-
vue学习之nodejs、nvm、webpack安装_shenpkun的博客
其中,nvm是nodejs版本的管理工具(还未测试)。
nvm下载和安装,nvm的使用,nvm常用命令,nvm安装node报错,nvm切换不了,系列集合
下面的第2条和第4条是在这里寻找的。 -
Node.js的安装及环境配置【超详细】_huangfuyk的博客安装Nodejs过程部分-推荐
-
如何安装webpack_明快de玄米61的博客下载Nodejs部分-推荐;也可以使用1.中的nvm管理nodejs版本
其中包含:
3.1 Nodejs的历史版本1和历史版本2任选其一都可以。
—3.1.1.msi
格式:Windows installer开发出来的程序安装文件,使用它不用配置环境变量;版本号-x64.msi
—3.1.2.zip
格式:解压即可用,但是需要配置环境变量;
3.2 Nodejs的安装(详细安装可以与上面的2.结合起来,有关环境变量的配置),
3.3更改为淘宝镜像
—(域名在22.6.30将进行更换,npmmirror)
—(淘宝镜像是什么意思(设置淘宝镜像代码))
—(npm 安装淘宝镜像、查看镜像设置以及设置返回原镜像_瑶瑶Limy的博客)推荐第1个方法,保留npm命令以后有用。
3.4webpack的全局安装(建议管理员身份运行,不建议Ctrl + r运行cmd)
指令 | |
---|---|
如果命令在VS Code不可用,则在前加npx | |
查看Nodejs的版本 | node -v |
查看npm的版本 | npm -v |
下载了一个全局包,这个包的默认存放路径位 | npm root -g |
查看(全局)webpack的版本 | webpack --version |
webpack.config.js(后面会被拆分) | 手动创建 |
创建package.json | npm init |
node_modules 以及 package-lock.json | 安装(局部)webpack后生成的文件夹 |
package-lock.json | 在npm install 执行后也会自动生成(node_modules )文件夹 |
查看(局部)webpack的版本 | node_modules/.bin/webpack --version |
查看Vue的版本 | npm list vue |
安装Vue CLI | npm install -g @vue/cli 或者npm install -g @vue/cli@版本号 |
查看Vue CLI的版本 | vue --version |
卸载Vue CLI | npm uninstall vue-cli -g |
安装失败,清除缓存 | 先将缓存清除了(npm cache clean 或npm clean cache -force 未测试),再安装 |
-------------------------- | ---------------------------------------------------------------------------------------------------- |
修改npm已下载的包版本的方法
在package.json配置文件中修改版本号,如图所示。
再在终端执行npm install
,即可。