简介
vikings-ignition 是一个前端项目构建工具，它基于 webpack 和 babel，可以帮助我们快速搭建前端项目开发环境，自动处理打包、转译、代码压缩等任务，使前端开发变得更高效、更便捷。
安装
使用 npm 安装 vikings-ignition：
npm install vikings-ignition --save-dev
使用
初始化项目
在项目根目录下新建 vikings-ignition.config.js 文件：
-- -------------------- ---- -------
----- ---- - ----------------
----- -------------- - ----------------------------
----- ------ - ----------------------- -------
----- ------- - ----------------------- --------
----- ------ - -
----- --------------
-------
--------
----------- ----
----- -
------ --- -----
--
-------- -
----- -------------------- ------------
--
--
----- -- - --- -----------------------
-------------- - ---------------开发模式
在 package.json 中添加 scripts：
{
"scripts": {
"start": "vikings-ignition start"
}
}执行 npm run start 启动开发服务器：
npm run start
然后，你可以在浏览器中访问 http://localhost:8080/，查看项目效果。
生产模式
在 package.json 中添加 scripts：
{
"scripts": {
"build": "vikings-ignition build"
}
}执行 npm run build 打包项目：
npm run build
配置
vikings-ignition 支持以下配置：
mode
用于指定项目的模式，开发模式 "development"，生产模式 "production"。
srcDir
用于指定项目的源代码目录，必须为绝对路径。
distDir
用于指定项目的打包目录，必须为绝对路径。
publicPath
用于指定项目的公共资源路径，默认为根路径 /。
html
包含 HTMLWebpackPlugin 的所有参数。
entries
用于指定需要打包的入口文件，如：
{
main: path.resolve(srcDir, 'index.js'),
vendor: path.resolve(srcDir, 'vendor.js'),
}output
用于指定 webpack 的 output 配置，如：
{
filename: '[name].[hash].js',
path: distDir,
publicPath: '/',
}module
用于指定 webpack 的 module 配置，如：
-- -------------------- ---- -------
-
------ -
-
----- ----------
------- ------------
-------- ---------------
-------- -
----------- ----------------------- -----------------
--
--
--
-resolve
用于指定 webpack 的 resolve 配置，如：
{
alias: {
'@': srcDir,
},
extensions: ['.js', '.ts', '.json'],
}总结
vikings-ignition 可以帮助我们快速搭建前端项目开发环境，使得前端开发变得更加高效、便捷。通过本文，我们可以学习到如何安装和使用 vikings-ignition，以及如何进行配置，希望本文对您有所指导和帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005601381e8991b448de1b6