vue初始化⼀个webpack项⽬（vueinitwebpackmyvue）、
webpac。。。
1、新建⽂件夹，在⽂件夹中，按住shift键，右击打开windows PowerShell
2、输⼊命令 vue init webpack myvue ，这⾥myvue是vue项⽬名
Project name myvue，按回车
Project description (A Vue.js project) 按回车
Author 作者的意思，随便输⼊⼀个名字
上下键进⾏选择，这⾥选第⼀个，回车
Install vue-router? 这⾥填⼊ y (是否安装vue-router)
Use ESLint  to lint your code? 这⾥填 y (是否使⽤ESLint)
Set up unit tests? 这⾥填 y (是否使⽤单元测试)
Setup e2e tests with Nightwatch? 这⾥填 y (是否使⽤e2e测试)
Should we run `npm install` for you after the project has been created? (recommended) 直接回车（项⽬创建完成后，是否执⾏ npm install 这条命令）
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
⽤于学习的话，以上y的选项，全改为n
进⼊到该项⽬，cd myvue
安装依赖环境(根据package.json安装的)：npm install
powershell创建目录
可能会遇到如下错误，根据提⽰输⼊ npm audit fix 修复它
安装sass加速器：cnpm install sass-loader node-sass --save-dev
项⽬的⽬录结构
使⽤IDEA打开该项⽬（该⽬录下会多⼀个.idea⽂件夹）
在IDEA的命令⾏输⼊命令启动程序：npm run dev
服务器端的NodeJS遵循Commons JS规范，该规范核⼼思想是允许模块通过require⽅法来同步加载所需依赖的其他模块，然后通过exports 或ports来导出需要暴露的接⼝。
导⼊：import "jquery";
导出：export function doStuff{}
模块：module "localModule"{}
安装Webpack
WebPack是⼀款模块加载器兼打包⼯具，它能把各种资源，如JS、JSX、ES6、SASS、LESS、图⽚等都作为模块来处理和使⽤。
安装命令：
npm install webpack -g
npm install webpack-cli -g
查看版本：
webpack -v            （4.44.0）
webpack-cli -v        （3.3.12）
如报错，多按⼏次就可以了。
配置
创建fig.js配置⽂件
enter:  ⼊⼝⽂件，指定WebPack⽤哪个⽂件作为项⽬的⼊⼝
output:  输出，指定WebPack把处理完的⽂件放置到指定路径
module:  模块，⽤于处理各种类型的⽂件
plugins:  插件，如：热更新、代码重⽤等
resolve:  设置路径指向
watch:  监听，⽤于设置⽂件改动后直接打包
学习webpack
1、创建⽂件夹，并⽤IDEA打开
2、创建⼀个名为modules的⽬录，⽤于放置JS模块等资源⽂件
３、在modules下创建模块⽂件，如 hello.js  ，⽤于编写JS模块相关代码
//暴露⼀个⽅法：sayHi
exports.sayHi=function () {
document.write("<h1>webpack学习</h1>");
};
4、在modules下创建⼀个名为main.js的⼊⼝⽂件，⽤于打包时设置entry属性
//require导⼊⼀个模块，就可以调⽤这个模块中的⽅法了
var hello=require("./hello");
hello.sayHi();
5、在项⽬⽬录下创建fig.js配置⽂件，使⽤webpack命令打包
entry:"./modules/main.js",
output:{
filename:"./js/bundle.js"
}
};
6、在IDEA的命令⾏输⼊：webpack  并按回车，，就会⽣成如下图⽂件
7、创建⼀个html⽂件，并把打包好的bundle.js导⼊
打开该页⾯

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。