使用工具idea
一、vue-loader+webpack项目配置
1.在盘符E:\project\idechuangyeproject\pom 新建vue-ssr-tech的文件夹
2.idea打开工程项目pom,选中vue-ssr-tech文件右键选择Open in Terminal打开终端
终端输入:npm init //初始化成一个npm的项目
E:\project\idechuangyeproject\pom\vue-ssr-tech>npm init This utility will walk you through creating a package.json file. It only covers the most common items, and tries to guess sensible defaults. See `npm help json` for definitive documentation on these fields and exactly what they do. Use `npm install <pkg>` afterwards to install a package and save it as a dependency in the package.json file. Press ^C at any time to quit. package name: (vue-ssr-tech) //此处下面全部默认:回车往下 version: (1.0.0) description: entry point: (index.js) test command: git repository: keywords: author: license: (ISC) About to write to E:\project\idechuangyeproject\pom\vue-ssr-tech\package.json: { "name": "vue-ssr-tech", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC" } Is this OK? (yes) yes //输入yes进入下一步
E:\project\idechuangyeproject\pom\vue-ssr-tech>
此刻在vue-ssr-tech项目下就会生成一个package.json
3.然后就可以安装需要的包
我需要用到webpack和vue,所以安装webpack和vue(使用vue要用到vue-loader)
终端继续往下:npm i webpack vue vue-loader // i : 全拼为install
E:\project\idechuangyeproject\pom\vue-ssr-tech>npm i webpack vue vue-loader npm notice created a lockfile as package-lock.json. You should commit this file. npm WARN vue-loader@15.7.1 requires a peer of css-loader@* but none is installed.
You must install peer dependencies yourself. //根据WARN提醒还需要安装css-loader第三方依赖 npm WARN vue-ssr-tech@1.0.0 No description npm WARN vue-ssr-tech@1.0.0 No repository field. npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win3 2","arch":"x64"}) + vue-loader@15.7.1 + vue@2.6.10 + webpack@4.41.2 added 346 packages from 206 contributors and audited 4268 packages in 216.616s found 0 vulnerabilities E:\project\idechuangyeproject\pom\vue-ssr-tech>
根据上面的安装WARN还需要安装css-loader
npm i css-loader
E:\project\idechuangyeproject\pom\vue-ssr-tech>npm i css-loader npm WARN registry Using stale data from https://registry.npmjs.org/ because the host is inaccessible -- are you offline? npm WARN registry Using stale package data from https://registry.npmjs.org/ due to a request error during revalidation. npm WARN vue-ssr-tech@1.0.0 No description npm WARN vue-ssr-tech@1.0.0 No repository field. npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win3 2","arch":"x64"}) + css-loader@3.2.0 added 14 packages from 9 contributors in 58.634s E:\project\idechuangyeproject\pom\vue-ssr-tech>
此时vue-ssr-tech项目就已经初始化好了
在项目下新建src文件夹作为源码放置的目录,此刻项目结构如下
原文:https://www.cnblogs.com/liwenhong199404/p/11695448.html