我最近在我的项目中添加了npm,以便更好地跟踪我的 js 依赖项。以前我只是将 git 克隆到我的 static/vendor 文件夹。
我还添加了gulp,但现在只让它做你好世界的事情。看起来很简单——它可以查看文件、缩小资产、编译 Sass。最终我可能会切换到Webpack,但是gulp很简单并且现在可以工作。我不想使用django-compressor或django-pipeline。
所以假设我跑去npm install vis拉取 visjs。它被添加node_modules到package.json依赖项中,并且记录被添加到依赖项中。
A)我是否在模板脚本中的 node_mods 中正确引用了 vis/dist?
<script src="/node_modules/vis/dist/min-vis.js' %}"></script>
# right now it's <script src="{% static 'vendor/min-vis.js' %}"></script
Run Code Online (Sandbox Code Playgroud)
B) gulp 是否应该监听 package.json 依赖项的更改,并在看到更改时将 vis/dist 复制到 static/vendor 或 static/js?
我一直看到人们在谈论 npm 和 gulp 时谈论处理 STATICFILE_DIRS。现在我的只是设置为以下。这会改变吗?
STATIC_URL = '/static/'
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static'),
)
Run Code Online (Sandbox Code Playgroud) 我试图捆绑webpack中的每个角度模块.我的目标是有一个app.js将由webpack与这个配置捆绑在一起:
entry: {
app: "./app/app.js"
},
output: {
path: "./build/ClientBin",
filename: "bundle.js"
},
Run Code Online (Sandbox Code Playgroud)
我将此捆绑脚本放在我的index.html中,这样它就是我应用的入口点.我在./app/components文件夹中有很多模块.文件夹结构如下:
app
|--components
| |
| |--home
| | |
| | |--home.html
| | |--home.js
|--app.js
|--AppController.js
Run Code Online (Sandbox Code Playgroud)
我已经要求home.html在home.js加载home.js所有需要的文件时加载.问题是我有几个组件home,我想告诉webpack分别捆绑每个组件,并用它包含的文件夹命名home.
如何配置webpack来创建这些包并将它们放入./build/components?